Как реализовать вертикальную компоновку жидкости с помощью div

Question

Мой сайт состоит из трех компонентов:

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

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

Возможно с divs?

Answer 1

Да, это возможно. Взгляните на липкий нижний колонтитул Райана Фейта и мой предыдущий ответ на аналогичный вопрос .

Answer 2

Вот, пожалуйста: http://jsfiddle.net/HcBKV/embedded/result/

Как правило, есть два способа сделать это.Один - с установкой высоты и ширины на 100%, другой - с растяжением с помощью абсолютного положения и фиксированной длины с каждой стороны.