Изменение порядка подстолбцов в столбце начальной загрузки ⇐ CSS

[Гость]

У меня есть базовый макет из трех столбцов (https://jsfiddle.net/mjaa64cj/), но я не могу поменять местами расположение текста/изображения на больших экранах элементов в последнем столбце. На мобильных и планшетных устройствах столбцы складываются нормально.
Снимок экрана ожидаемого макета
Я использую загрузочную версию 3.2. Подробности смотрите в скрипте.
Вот HTML-код:

Код: Выделить всё

[img]holder.js/350x350[/img]
I, Roommate
Oh sure! Blame the wizards! Bender, this is Fry's decision… and he made it wrong. So it's time for us to interfere in his life. Man, I'm sore all over. I feel like I just went ten rounds with mighty Thor.

The Farnsworth Parabox
I just told you! You've killed me! With a warning label this big, you know they gotta be fun! When will that be? Man, I'm sore all over. I feel like I just went ten rounds with mighty Thor. Mor's good friend, Richard Nixon. Say it in Russian
[img]holder.js/350x350[/img]



A Pharaoh to Remember
With a warning label this big, you know they gotta be fun! Moving along… Bender, this is Fry's decision… and he made it wrong. So it's time for us to interfere in his life. Morbo can't understand his teleprompter because he forgot how you say that letter that's shaped like a man wearing a hat. Why would I want to know that.

[img]holder.js/350x350[/img]

Have tried with push/pull the elements in the 3rd column, but the content is just overflowing beyond the edge of the screen or over the 2nd column.
Do you have any idea how to solve this?


Источник: https://stackoverflow.com/questions/286 ... rap-column