Как вывести элементы таким образом?

Question

[Антон Середний]

Не могу понять как правильно выводить вот так элементы... И не знаю с какой стороны двигаться: давать классы и выводить со стороны пхп (вордпресс) или же можно все решить CSS? Подскажите, пожалуйста, как решать подобные задачи правильно?

Интересует вывод самих миниатюр разного размера и с разным выравниванием ( одна из больших слева, а мелкие обтекают ее справа, а вторая большая СПРАВА, а мелкие элементы обтекают ее слева)

Answer 1

[Mikhail Osher]

Контейнеру

display: flex
flex-direction: column

Большому
flex-grow: 2

Дальнейший тюнинг уже по требованиям делать (responsive или нет, фикс размеры или нет итд)

Answer 2

[Максим Тимофеев]

давать классы и выводить со стороны пхп (вордпресс) или же можно все решить CSS

а классы это не css?

Подключите вот эту библиотеку masonry.desandro.com

Answer 3

[edk55]

Я бы сделал так.
Надеюсь, мысль ясна.

Answer 4

[Aleksandr_Frontend]

Подобную структуру необходимо делать с помощью сетки. Можете использовать готовые решения (bootstrap, foundation) или же сделать свою. В принципе можно сделать на обычном CSS, но времени такой способ скушает в разы больше.