Android 4.2上的子元素忽略最大高度

在Android 4.2.2的內置瀏覽器中，我在大於max-height的元素上定義了一個height。所以它按預期使用max-height。Android 4.2上的子元素忽略最大高度

但有一個子元素100％height，它似乎繼承了它的父母height但不是max-height。因此，當它意圖被包含在其中時，它會溢出父母。

我可以通過將max-height設置複製到孩子來解決這個問題，但父母的邊界/填充仍然會阻止孩子被完全包含在父代中。

有沒有很好的理由/解決這個問題？它似乎沒有發生在其他瀏覽器上，例如Chrome。

<!DOCTYPE html> 
<html> 
    <head> 
    <style> 
     .a { 
     position: absolute; 
     top: 100px; 
     left: 100px; 
     width: 200px; 
     max-height: 50%; 
     height: 500px; 
     border: 20px solid red; 
     box-sizing: border-box; 
     } 
     .b { 
     position: relative; 
     width: 100%; 
     height: 100%; 
     border: 20px solid yellow; 
     box-sizing: border-box; 
     } 
    </style> 
    </head> 
    <body> 
    <div class="a"> 
     <div class="b"> 
     </div> 
    </div> 
    </body> 
</html>

來源

2016-02-02 JW.

出來，它的設置工作簡單地將孩子是位置：絕對;?

.b { 
    position: absolute; 
    width: 100%; 
    top: 0; 
    bottom: 0; 
    border: 20px solid yellow; 
    box-sizing: border-box; 
}

來源

2016-02-02 23:31:14 user500665

Android 4.2上的子元素忽略最大高度

回答

相關問題