Увеличить высоту нижнего колонтитула до нижней части страницы

У меня очень простая веб-страница с проблемой. Это 3 блока, которые располагаются друг над другом: заголовок, содержимое и нижний колонтитул.

Я хочу, чтобы высота моих нижних колонтитулов увеличивалась до нижней части страницы. Как я могу это сделать?

Заголовок имеет постоянную высоту, содержание будет различаться по высоте в зависимости от содержания, полученного от вызова AJAX. Поэтому я не могу его явно установить.

Вот мой JSFiddle: http://jsfiddle.net/5U6ZB/2/embedded/result/

    


    


body { background-color: white; }
div  { width: 100%; }

#header {
    height: 400px;
    background-color: RGB(200,200,200);
}

#content {

}

#footer {
    background-color: RGB(112,112,112);
    /*How do I make the footer height fill up the rest of the page height?*/
}