Как сделать самоперестраивающийся список?

Question

[KRHD]

есть такой макет

Страцницы подгружаются из базы, и они могут как увеличиваться, так и уменьшаться в количестве.
Дак вот, как сделать такой список, чтоб он сам перестраивался в зависимости от размеров родителя.
Не влез - следующая колонка

Comments

[Lynn «Кофеман»]

https://developer.mozilla.org/en-US/docs/Web/CSS/c...

[Ankhena]

Если весь контент виден сразу, то css columns.
Если есть подгрузка, то masonry

Answer 1

[Сергей delphinpro]

Какую же хрень пишут в ответах, флексы, гриды... Вообще не к месту.
Не могу на это смотреть. Держите:

Answer 2

[MamaLuyba]

через css grid

#parent {
  display: grid;
  grid-template-rows: repeat(auto-fit, minmax(250px, 1fr));
}

auto-fit - это когда новый элемент, не помещающийся по ширине/ высоте в родительский блок, будет отображен в новом ряду/ колонке. например, родитель шириной 500px, содержит два блока по 250px минимум - при добавлении нового блока, блок либо уйдет в новый ряд (grid-template-columns), либо в новую колонку (grid-template-rows).

Comments

[Ankhena]

Покажете реализацию?