最大高度嵌套不工作

Question

我正在應用最大高度嵌套divs？但它沒有按預期工作根元素的工作是完美的，但孩子身高不適用？

<div style="max-height: calc(33% - 10px);"> 
    <div style="height:30px;"></div> 
    <div style="max-height: calc(100% - 30px);"> 
    //height not applying 
    </div> 
</div> 

Answer 1

不幸的是，百分比高度從父元素，而不是它的實際高度的明確地指定height計算。如果未設置height，則爲auto，不能用於百分比。只有Opera 12-（Presto）直接從指定的min-height計算min-height的百分比。

假設你不關心舊的瀏覽器（因爲你使用calc()這樣的現代功能），我建議嘗試Flexbox的佈局。