方法一：給父級元素新增宣告：overflow:hidden;。
例： .wrap{ border:3px solid #000;overflow:hidden;}
.box01{ width:500px; height:500px; background:#F00; float:left;}
.box02{ width:500px; height:500px; background:#09F; float:left;}
方法二：給父級元素新增高度：height 。
此處不舉例
方法三：在浮動元素下方新增空div，並宣告：{clear:both;height:0;overflow:hidden;}
.wrap{ border:3px solid #000;}

.box01{ width:500px; height:500px; background:#F00; float:left;}

.box02{ width:500px; height:500px; background:#09F; float:left;}
.clear{clear:both; height:0; overflow:hidden;}
方法四：萬能清除浮動法
.wrap{ border:3px solid #000;}

.box01{ width:500px; height:500px; background:#F00; float:left;}

.box02{ width:500px; height:500px; background:#09F; float:left;}
.clear：after{content:”.”; display:block; clear:both; height:0; overflow:hidden; visibility:hidden; }
方法四備註：(class:”clear” 新增在父級元素class中： class:”wrap clear”)
總注：給以上四種方法中的父元素新增宣告：{zoom:1;} 即可相容IE6瀏覽器。