최대 높이가 중첩되지 않음

Question

중첩 된 div에 최대 높이를 적용하고 있습니까? 하지만 예상대로 작동하지 않습니다 루트 요소 작업이 완벽하지만 어린이 높이가 적용되지 않습니까?

<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입니다. 오직 오페라 12- (Presto)만이 min-height에서 percantage min-height을 계산합니다.

calc()과 같은 최신 기능을 사용하므로 오래된 브라우저는 상관하지 않는다고 가정하면이 레이아웃을 위해 Flexbox를 사용해 보시기 바랍니다.