解释我的问题的最佳方式是使用代码示例。我已经链接了两个 fiddle 。
Immediate Child
在这个例子中，.wrapper 是 body 的直接子元素，两个 float .left, .right 接受 height: 100%;
Nested Child
在这个例子中，.wrapper 不是 body 的直接子元素，两个 float .left, .right 不接受 高度:100%；
据我所知，height: 100%; 不适用于 float ，需要使用使用绝对位置和表格单元格等的技术。那为什么他们在前一种情况下工作。
PS:在最新稳定的 Chromium 和 Firefox 中测试
最佳答案
height: 100% 仅当父元素的高度不是auto 时才有效。
所以在你的第二个例子中，缺少的是 .container { height: 100%; and then it works.
关于html - 为什么漂浮在作为 body 标签的直接子项的包装器中接受 100% 高度，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/27920778/