Как во flex сделать одинаковую высоту блоков на всех строках при использовании wrap?

Question

[LionG]

Получается что для каждой строки берется своя максимальная высота элемента строки. Можно вручную задать высоту но контент динамический. Еще можно написать скрипт который пройдет по всем элементам и установит им определенную высоту но это костыль какой то.

<div class="parent">
	<div class="child"><div style="height:50px"></div></div>
	<div class="child"><div style="height:35px"></div></div>
	<div class="child"><div style="height:40px"></div></div>
	<div class="child"><div style="height:55px"></div></div>
	<div class="child"><div style="height:80px"></div></div>
	<div class="child"><div style="height:60px"></div></div>
</div>

div.parent {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  max-width: 800px;
}

div.child {
  margin: 4px;
  display: flex;
  width: 250px;
  background-color: grey;
}

https://codepen.io/liong2/pen/gOOeMwX

Answer 1

[Сергей delphinpro]

Гриды заюзать

Answer 2

[Даниил Постнов]

div.parent добавить свойство align-items: stretch.

div.parent {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-items: stretch;
  max-width: 800px;
}