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

[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