Как верстается страница, когда при изменеинии ширины страницы меняется количество блоков?

Question

[mrruslan]

Как сверстать такой дизайн? megalyrics.ru При изменении ширины страницы меняеться количество блоков. Изменение происходит с эффектом

Answer 1

[Виталий Киренков]

masonry.desandro.com

Answer 2

[Sali_cat]

медиа запросы + transform и transition. Можно на js сделать... Вот пример в бонус там сортировка есть)

Answer 3

[KorsaR-ZN]

display: inline-block, с vertical-align: top, но из-за того, что заголовок в зеленном поле может быть разной высоты, будут дырки образоваться между блоками из-за самого высокого блока в строке, тут тогда нужно на JS всем блокам в рамках одной строки выровнять высоту по самому высокому в строке.

Answer 4

[Vurdalak]

по мне так лучше юзать bootstrap либо zurb foundation, более корректно отображается на разных разширениях