填充剩餘空間（CSS）

Question

我創建了一個jsfiddle：http://jsfiddle.net/cMqTd/1/

我有三個div。父級，標題和內容。標題的高度未知，內容div應填充剩餘空間。

我試過height: 100%但它不是我所期望的。

Answer 1

嘗試浮動頭：

#head { 
    background: green; 
    float: left; 
    width: 100%; 
} 

Answer 2

浮動頭正常工作（不知道爲什麼在布萊斯的答案downvotes）。

HTML：

<div id="parent"> 
    <div id="head">head<br />head<br />head<br /></div> 
    <div id="content">content</div> 
</div> 

CSS：

html, body { 
    margin: 0px; 
    height: 100%; 
} 
#parent { 
    background: red; 
    height: 100%; 
} 
#head { 
    background: green; 
    width: 100%; 
    float: left; 
} 
#content { 
    background: yellow; 
    min-height: 100%; 
} 

和工作JSFiddle。

[編輯] 將height的#content更改爲min-height。