Как сверстать такое (см. скрин)

[Squidward]

Здравствуйте. Есть задача сделать вот это:

Пользователь будет грузить картинки сам, поэтому картинки будут разновеликие. Нужно, чтобы они вставали в похожую структуру. Картинки будут увеличиваться по клику в реальный размер.

[ShumNo]

картинки резать на сервере либо средствами css подогнать под размеры, чтобы в сетку влезала + masonry или аналоги

[radioactive68]

http://codepen.io/Radioactive/pen/rVawGz

дальше сами я думаю...

Edited April 27, 2015 by radioactive68

[Squidward]

Спасибо. Натолкнули на идею. Превьюшки буду резать на сервере к единому размеру, а при выводе их в цикле на сервере буду заворачивать в блоки с нужными классами в зависимости от номера итерации; оборачивающим картинки блокам задам overflow:hidden, а картинки буду позиционировать по центру блока, так как на макете не у всех блоков одинаковые пропорции сторон. Или же не на сервере назначать классы блокам, а на клиенте через js, а до построения галереи скрывать ее и отображать анимированную гифку загрузки.