高度问题：100％;

Question

我正在围绕身高进行一些测试：100％。

在THIS页面上，您可以注意到蓝色区域不会随页面内容拉伸其高度，即使它被指定为CSS样式：

html{ height:100%; }
body{ height:auto; }

我尝试失败了：

body{ height:100%; }

有关解决或尝试理解此行为的任何帮助吗？

Answer 1

您尝试做的事情被称为“虚假列”，不幸的是答案不是height: 100%。许多博客/开发人员已经详细介绍了这个问题，但我发现的各种技术的最佳综述是由Chris Tryier在CSS Tricks中的this article。它特别针对流体布局中的人造柱，这是你在小提琴中尝试做的事情。

以下是Coyier伟大的CodePen网站上的文章演示：

http://codepen.io/cantera25/pen/lILha