如果这是一个老问题或已知问题,我很抱歉,但我无法在网上找到答案.如果我有代码
<style>
html, body { height: 100%; width: 100%;}
#div1 {height:50%; min-height:200px;background-color:red;}
#div2 {height:100%; background-color:black;}
</style>
<body>
<div id="div1"><div id="div2"></div></div>
</body>
Run Code Online (Sandbox Code Playgroud)
然后在firefox中,黑色内部div在屏幕收缩时缩小并停在200px高度.然而,在webkit浏览器中,红色外部div停止但内部div继续缩小,就像它在没有min-height属性的父div中一样.
是否有一个简单的方法可以使webkit版本与firefox渲染一致?一个min-height:inherit如果放在内部的div,但在一个范围内的诸多的div的情况下,这需要工程min-height:inherit上的每个孩子股利.还有更优雅的解决方案吗?