float参数有问题，所以做了一个简单的代码片段来显示问题(当然它很简单，但不能精确定位)。
根据我对float声明的理解，它应该:
- 将第一个section向上向左或向右移动
- 下一节应该移动到第一部分的左边或右边，只要还有足够的宽度空间
- 上面应该继续，直到宽度空间不可用，必须创建一个新的行
然而，这些节只是在声明中指定的一侧一个叠在另一个上。不能让他们靠近一个
header,
footer {
text-align: center;
height: 30px;
width: 100%;
border: 1px solid black;
clear: both;
}
section {
text-align: center;
height: 30px;
width: 20%;
float: left;
border: 1px solid black;
clear: both;
}<header>Header</header>
<section>Section 1</section>
<section>Section 2</section>
<section>Section 3</section>
<footer>Footer</footer>问题是"你可以用两种方式继续:
解决方案1:
如果你想使用"clear"样式规则必须应用于包含"float":
的部分(在示例中为div)的父元素。