我发现一种方法可以使一个div容器至少占据整个页面的高度，方法是设置min-height: 100%;。然而，当我添加一个嵌套的div并设置height: 100%;时，它并没有延伸到容器的高度。有没有办法修复这个问题？
html, body { height: 100%; margin: 0; } #containment { min-height: 100%; background: pink; } #containment-shadow-left { height: 100%; background: aqua; } Hello World!
在父容器中添加
height: 1px。在Chrome、FF和Safari中有效。这是一个已报告的webkit（chrome/safari）bug，具有最小高度的父元素的子元素无法继承height属性：https://bugs.webkit.org/show_bug.cgi?id=26559
显然Firefox也受到影响（目前无法在IE中测试）
可能的解决方法：
当内部元素具有绝对定位时，该bug不会显示。
请参见http://jsfiddle.net/xrebB/
2014年4月10日编辑
由于我目前正在进行一个非常需要具有
min-height的父容器和子元素继承容器高度的项目，所以我进行了更多的研究。首先：我不再确定当前浏览器行为是否真的是一个bug。CSS2.1规范说：
如果我在容器上设置了min-height，我并没有明确指定其高度 - 所以我的元素应该获得一个
auto高度。这正是Webkit - 和所有其他浏览器 - 所做的。其次，我找到的解决方法：
如果我将容器元素设置为
display:table并使用height:inherit，它的行为与给它一个min-height为100%完全相同。而且 - 更重要的是 - 如果我将子元素设置为display:table-cell，它将完美地继承容器元素的高度 - 无论是100%还是更多。完整的CSS：
html, body { height: 100%; margin: 0; } #container { background: green; display: table; height: inherit; width: 100%; } #content { background: red; display: table-cell; }标记：
请参见http://jsfiddle.net/xrebB/54/。