Как прижать дочерний блок к низу родительского?

#html #css

В верстке есть такой блок, фиксированной высоты, в него вложены ещё три блока, верхний
и нижний - фиксированной высоты, тот, что посередине - нет. 



Не  могу понять, как прижать нижний блок к низу родительского.
    

Ответы

Ответ 1

У дочернего в стилях пишите:
position: absolute;
bottom: 0px;


Ответ 2

Родительскому установить:
position:relative;
padding-bottom:50px;

Дочерному:
position:absolute;
bottom:0;


Ответ 3

Хм... Если размеры вам известны, то тут чистая математика. Если только средствами
CSS, то можно, например, так сделать. Если размеры не известны изначально, то тут в
помощь JS/jQuery.


Ответ 4

@Heidel, извините, что с опозданием, вот взгляните - http://jsfiddle.net/Alex83/qktyU/
Если коротко, то блоку обертке задаем:
min-height: 100%; /*При этом у body, html { width: 100%; height: 100%;*/

А footer выносим за предел блока обертки и устанавливаем ему отрицательный верхний
отступ:
margin-top: -50px;


Ответ 5

#wrapper {
 display: flex;
 flex-direction: column;
 height: 600px;
}
#center {
 flex-grow: 1;
}