Строки одинаковой высоты в гибком контейнереCSS

Разбираемся в CSS
Ответить
Anonymous
 Строки одинаковой высоты в гибком контейнере

Сообщение Anonymous »

Как видите, элементы списка в первой строке имеют одинаковую высоту. Но элементы во второй строке имеют разную высоту. Я хочу, чтобы все элементы имели одинаковую высоту.

Есть ли способ добиться этого, не задавая fixed-height и только используя flexbox?

Изображение


Вот мой код

Код: Выделить всё

.list {
display: flex;
flex-wrap: wrap;
max-width: 500px;
}
.list-item {
background-color: #ccc;
display: flex;
padding: 0.5em;
width: 25%;
margin-right: 1%;
margin-bottom: 20px;
}
.list-content {
width: 100%;
}

Код: Выделить всё

[list]
[*]

box 1
Lorem ipsum dolor sit amet, consectetur adipisicing elit.

[*]

box 2
Lorem ipsum dolor sit amet, consectetur adipisicing elit.

[*]

box 2
Lorem ipsum dolor

[*]

box 2
Lorem ipsum dolor

[*]

h1

[/list]



Подробнее здесь: https://stackoverflow.com/questions/360 ... -container
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «CSS»