Как сверстать flexbox?

Question

[WebDev]

Есть сетка товаров. Товары двух типов: "обычный" и "широкий".
Обычный товар занимает одну треть ширины контейнера, а широкий две трети.
Я сверстал это с помощью flexbox и все хорошо, но в последнем ряду блоки расползлись по краям.
Подскажите, пожалуйста, как сделать, чтоб в последнем ряду блоки шли друг за другом?

Codepen

Answer 1

[Сергей Горячев]

Либо убрать justify-content: space-between; у блока .content.
Либо скриптом добавлять пустой блок в самый конец, это уже не раз обсуждалось на Тостере.

Answer 2

[Анатолий]

Вообще, для этого существует CSS Grid Layout, но поддержка хромает.