Как позиционировать блоки при адаптивной вертске?

Question

[vetsmen]

Суть вопроса: есть 2 блока (левое меню и правый контент). Вот страница: https://jsfiddle.net/5t2pmz0f/
Дело в том, что мне нужно, чтобы у контента была ширина = (100% - ширина меню), так же ширина меню может динамически изменяться.
Способ с position: absolute у меню не особо устраивает, ибо тогда ширина контента 100%, затем нужно будет все равно как-то оперировать с шириной меню, чтобы вывести информацию строго в видимых границах контента.
Есть способ еще с width: calc(100% - ширина меню), но тогда при изменении ширины меню придется так же менять и ширину контента.
В общем в обоих случаях нужно будет прибегать каким-либо образом к js.
Как можно избежать js и сделать так, чтобы ширина контента была именно такой, какая мне нужна (100% - ширина меню), при этом учитывая факт, что ширина меню может постоянно изменяться?

Answer 1

[V Sh.]

Просто не указывайте ширину контента. Она сама у вас будет равна 100% - ширина меню. Ибо блоки по-умолчанию занимают все предоставляемую им ширину.

Comments

[vetsmen]

В моем примере это не получается.

[V Sh.]

vetsmen, вот так попробуйте

Answer 2

[Андрей]

https://jsfiddle.net/5t2pmz0f/1/

Comments

[vetsmen]

При использовании display: flex нельзя позиционировать дочерние контейнеры, вида float; А это мне нужно.

[Андрей]

vetsmen, Позиционирование контейнеров и использование float, на мой взгляд, вещи совсем не связанные :)

[Егор Живагин]

vetsmen, насколько дочерние? В примере float не применится только к main и sidebar (их как раз flex позиционирует), а вот с их детьми можно будет работать
Обновил пример автора