最大高度嵌套不工作

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的布局。