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

На рабочем столе мне нужно, чтобы правый столбец был фиксированного размера, скажем, 200px, а остальная часть была занята левым столбцом. Естественно, мне нужны столбцы, чтобы очистить и толкнуть содержимое внизу.

На мобильном они просто будут складываться. Таким образом, левый столбец находится над правым столбцом.

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

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

Я опытный разработчик, что делать это должно быть проще, чем я нахожу?