Как ровно сверстать такую сетку кирпичиками?

Question

[Сергей Сергеевич]

Всем привет.
Как можно сверстать ровную сетку изображений —
Сейчас на инлайн блоках, с выставлением каждой 3й вертикального выравнивания по низу. Нашел выход в минусовом левом марджине на ширину картинки с отступом. Может есть какие нибудь современные решения?
P.s Изображения фиксированной высоты и ширины, Masonry не предлагать.
P.s.s Правильная сетка выглядит так (можно без центровки)

Answer 1

[DTX]

Flexbox и только, нафиг masonry
codepen.io/DTX/pen/gMaEyL

Comments

[Сергей Сергеевич]

В лисе проблемы s015.radikal.ru/i333/1606/b6/8d9223062a52.png

[DTX]

SergeyKisliy: что за проблемы? Вроде та же структура, что и в шапке, только без отступов.

[Сергей Сергеевич]

DTX: добавил правильную раскладку

[DTX]

SergeyKisliy: в общем, флексбокс с горизонтальным направлением. Маленькие картинки оборачивать в один блок.
Курить это:
html5.by/blog/flexbox

[Сергей Сергеевич]

DTX: к сожалению обертку не сделать, т.к контент генерируймый

Answer 2

[display: block]

Masonry

Comments

[Сергей Сергеевич]

Нет, ради маленького блока, тянуть js скрипт не вариант

[display: block]

Masonry на css w3bits.com/css-masonry

[Сергей Сергеевич]

qork: Поддержка вроде неплохая, спасибо за вариант