Как сверстать галерею с разными размерами картинок?

Question

[sasha_jarvi]

Имеется следующая галерея:


Как сверстать такую галерею при помощи CSS Grid либо иных инструментов, если картинки имеют одинаковую ширину, но разную высоту?

Answer 1

[Eugene Chefranov]

Masonry

Answer 2

[Владимир]

Зависит от, вам подходит чтобы картинки располагались сверху вниз и слева направо, то можете воспользоваться флексбоксом
https://css-tricks.com/snippets/css/a-guide-to-flexbox/
ну или https://masonry.desandro.com/

Answer 3

[Антон]

Как сделать нестандартную сетку на гридах?

Answer 4

[Михаил Лялин]

Masonry и Isotope

Answer 5

[Максим]

https://codepen.io/topicstarter/pen/PMQYwE самый простой способ, только ширина одинаковая должна быть

Answer 6

[sasha_jarvi]

Можно воспользоваться .card-columns на Bootstrap
https://getbootstrap.com/docs/4.0/components/card/