爲什麼這不是100％的高度？

Question

CSS

html { height: 100%; } 

body { min-height: 100%; margin: 0; } 

#test { height: 100%; background: red; width: 50px; } 

HTML

<div id="test">test</div> 

http://jsfiddle.net/k176a1xc/1/

爲什麼不#TEST有100％的高度？

Answer 1

因爲身體min-height應該被定義爲height：

body { 
    height: 100%; 
    margin: 0; 
} 

叉小提琴 - >http://jsfiddle.net/p7vn7vrj/
的bodymin-height百分比是 「無中生有」 一min-height，因爲沒有height計算min-height百分比反對。因此#testheight將與未設置的主體min-height相同。

的CSS層次是

height 
    min-height 
    max-height 
    height (child) 
     min-height 
     max-height 

等