Как сделать разметку страницы как на картинке?

Question

[Stacy None]

Никак не могу сделать именно вот такую разметку.
Пытался объяснить людям, все кидают ссылки на dashbor'ы полноэкранные!
А мне нужна именно такая разметка! Подскажите пожалуйста как её реализовать?


Спасибо!

Answer 1

[AlexKeller]

И что тут такого нереально сложного?

<div class="main">
  <div class="sidebar"></div>
  <div class="container"></div>
</div>

В обычном состояние flex-direction для враппера row, в адаптации - column

Comments

[Stacy None]

А подробней можно? пжлст.

[AlexKeller]

Stasy11: https://jsfiddle.net/s3epLhbt/1/

Answer 2

[Arman]

Можно посмотреть как сделано или использовать бутстрап getbootstrap.com/css/#grid-column-ordering
Т.е. скорее всего у вас проблема что левая панель становится выше Контент блока, поменяв их местами через смещение вы сможете для мобил получить правильный вертикальный порядок. Просто для мобил надо будет дать 12, а для десктоп 3 и 9 или что у вас там