原文地址：http://www.codefans.net/articles/653.shtml
因CSS很多布局是需要浮动的，当属性设置float（浮动）时，其所在的物理位置已经脱离文档流了，为了使float后面的元素不被float浮动层的影响，我们就需要用clear:both;来清除。比如下面的例子：
1 |
<p style="float:left;width:200px;">第1列，</p> |
2 |
<p style="float:left;width:400px;">第2列，</p> |
3 |
<p style="clear:both;">第3列。</p> |
如果没有清除浮动，那么第3列文字就会和第1、2列文字连在一起 ，所以需要在第3个列上加入清除浮动的代码。
一般情况下，我们会为清除浮动专门定义一个CSS类，用时候直接引用，这样更方便，比如：
05 |
<div class="clear"></div> |
08 |
<p style="float:left;width:200px;">第1列，</p> |
09 |
<p style="float:left;width:400px;">第2列，</p> |
10 |
<div class="clear"></div> |
因为IE和火狐存在兼容性问题，所以有时候这样定义清除浮动会在不同浏览下效果会不同，IE也说的过去，在火狐下或许就不灵了，下面给出一个经过调试的CSS清除浮动代码，供参考：
清除浮动一般是在外层Div结束前，如果放在结束后，则无效。
clear both
原文：http://www.cnblogs.com/darkterror/p/5358033.html
