让div填满余下的空间

Question

Fiddle

我想有多个带边距的div，下面有一个填充固定大小父div提供的剩余空间的div。

编辑：对不起，我应该提到容器div的大小是固定的，不应该改变。

EDIT2：SOLUTION。 我曾尝试过overflow：隐藏但是误解了它并把它放在了child元素而不是父元素上。

Answer 1

希望这是你想要的http://jsfiddle.net/FR5Ud/33/

Answer 2

使用min-height，以便您的页面基本外观保持不变，并根据内容增加

#container {
    float: left;
    background-color: green;
    width: 300px;
    min-height: 300px; height
    border-color: violet;
    border-style: solid;
    border-width: 10px;
}

#content {
    background-color: blue;
    min-height: 100px; height:auto
}

#toFillUp {
    background-color: red;
    /* that's what it should end up looking like.
    However, what if the size of #content changes?
    What if there are more content divs before that?
    What if those have margins? */
    min-height: 200px; height:auto
}​

演示http://jsfiddle.net/FR5Ud/25/