我有一个网站的布局已在图中显示。主体由一个主容器组成，包含头，父div和页脚。父div还包含几个子div，如图所示。
问题是所有的子div的高度是有限的。但是父div只包含子div。所有的子div都是可见的，但父div的高度显示为零。我也不是通过给一些预先指定的值来固定父div的高度，因为它可能会导致错误，如果孩子数量在未来增加。
由于父div的零大小的问题是我的页脚div正在上升并与父div的内容冲突。这可以通过给一个合适的margin-top来解决，但这不是一个解决方案，我要找。
任何人都可以建议我一些方式，使父div的高度根据存在的子div的高度自动更改。
请评论，如果我不清楚提出我的怀疑！
解决方法
似乎你有一个案件为
clearfix class。
所以我猜你漂浮的孩子div，这就是为什么父div的高度为0。
当你使用浮动，父母不适应孩子的高度。
但添加类’clearfix'(当然你需要在你的样式表中)，它将添加一个’。 (当然不可见)，你的父母将神奇地具有正确的高度。
注意，它的跨平台，兼容IE6，Chrome，Safari，Firefox，你叫它！
.clearfix:after {
content: ".";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0;
}
.clearfix {
display: inline-block;
}
html[xmlns] .clearfix {
display: block;
}
* html .clearfix {
height: 1%;
}
