那个白色的长条是footer，即
<div class="footer"></div>
由于在它前面的side和centent都是浮动元素，而在后面又没有清除浮动（我注意到side和centent都有清除浮动，但这是没用的，只能清除其内部元素的浮动），这样的话footer就会无视side和centent的存在，自动跑到header的下面了。必须在footer的前面添加一个清除浮动的元素才行，比如：
<br style="clear:both" />
<div class="footer"></div>
<html><head>
<title>无标题文档</title>
<style type="text/css">
.box{ border-top:1px solid #F00width:100px}
</style>
</head>
<body>
<div class="box">这是一个测试</div>
</body>
</html>
测试一下是不是你所需要的
这个是相同样式的继承（或者说覆盖）问题。打个比方说，<body></body>标签里有<p></p>标签，<p></p>标签里又有<a>标签，而三个标签都有font这个样式属性。那么用到<a>标签上的样式属性，就只能是在<a>标签上定义的font样式，把<body>和<p>标签的font样式覆盖了。
