Как поменять местами блоки div?

Question

[keche]

Пример есть 4 блока codepen.io/Keche/pen/JWMPBa
Если создать условия чтобы блоки выстраивались друг под друга. То последовательность блоков будет такая:
Блок 1
Блок 2
Блок 3
Блок 4

А как сделать чтобы при адаптивности было так:

Блок1
Блок3
Блок2
Блок4

Answer 1

[Novamoscow]

Если можно использовать флекс бокс. То это очень просто.

Если нельзя, я решил эту проблему дублированием блока.

Comments

[keche]

Каким дублированием? Можете показать на примере codepen.io/Keche/pen/JWMPBa?

[Novamoscow]

keche: https://codepen.io/novamoscow/pen/aJYWyB

[Novamoscow]

Novamoscow: если не понятен код, пиши

Answer 2

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

flexbox - codepen.io/anon/pen/evMjyG

Comments

[keche]

Не работает. Или я не понял как это сделать. Можете показать на примере codepen.io/Keche/pen/JWMPBa?

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

keche: Или на флексах codepen.io/anon/pen/evMjyG

Answer 3

[Евгений Кравченко]

Просто 1 и 3 блок помести в один div, а 2 и 4 в другой. В стилях новых блоков задай резиновую ширину и "float: left"

Comments

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

Не обязателен wrapper для блоков, итак перестроится.

[keche]

Не работает. Или я не понял как это сделать. Можете показать на примере codepen.io/Keche/pen/JWMPBa?

[Евгений Кравченко]

keche: codepen.io/anon/pen/wJmgqK

Блоки помещены в .container, если изменять размеры .content то будет смещение в нужном вам порядке.