Bom criei um div principal para comportar todos os elementos da página. Dentro dele tenho 3 outros `divs`: 1 barra de menu, 1 barra lateral, 1 area de conteudo. HTML: <div class="principal"> <div class="barra_menu"> Barra de menu </div> <div class="menu_lateral"> <!--Como se estende esse div até o fim da página/elemento pai--> Menu lateral:<br>.<br>.<br>. </div> <div class="area_conteudo"> Area de conteudo:<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>. </div> </div> CSS: .principal{background-color:red;height:100%;} .barra_menu{background-color:gray;widht:100%;} .menu_lateral{background-color:blue;width:30%;float:left;} .area_conteudo{background-color:green;width:70%;float:left;} Eu quero que o menu lateral se estenda da posição de onde ele se encontra até o fim da página, mas não sei a solução. Gostaria de obter uma solução baseada apenas em HTML/CSS preferencialmente sem utilizar posicionamento absoluto. A seguir um exemplo visual do que eu quero fazer: https://jsfiddle.net/m17wuaLc/2/