Как сделать разное расположение div?

Question

[saalaus]

Хочу сделать так, как показано на моей картинке, то есть 1 div слева во всю высоту, и 200px в длину, внутри которого внизу другой div, и справа div занимает все оставшееся место.

Answer 1

[Anton fon Faust]

%, vh и calc вам в помощь.
Ну, еще position: relative и absolute

Answer 2

[Павел Антонов]

%, vh и calc вам в помощь.
Ну, еще position: relative и absolute

Как вам посоветовали выше примерно так:
https://codepen.io/freislot/pen/GBxWRj

Answer 3

[Антон Спирин]

Хорошо изучите спецификацию Flexbox и подобных вопросов у вас не будет возникать никогда.
Простой пример

Answer 4

[Darya Shvakh]

saalaus, всю вашу архитектуру нужно завернуть ещё в один див и ему задать св-во дисплей: флекс, у этого-же дива изменить направления для дочерних элементов с вертикального на горизонтальный за это отвечает св-во флекс-дирекцион и ему задать направление - ров; всё с родителем - закончили. Дальше дочерним элементам задать жадность - флекс-гров, одному 1 другому 7 (методом подбора). Потом левому вашему диву (тот который узкий с двумя внутри) также задать дисплей - флекс, направление с верху в низ по дефолту, можно не задавать, и ему же для выравнивания дочерних по вертикали алинг-контент или алинг- селф.
Эту магическую технологию CSS назвали - флексбоксы.
https://goo.gl/GW5rm6

Answer 5

[RayTop]

Все просто. Через стили(CSS) задается в % ширина DIV и расположение один слева другой справа.
Чтобы оба DIV находились на одной горизонтали не пересекаясь их суммарный % должен быть меньше или равен 100%.
И да выше уже это писали - неплохо бы всю конструкцию еще в один DIV завернуть.