清除浮动的方法

<h3 style="margin: 0px; padding: 10px 0px; font-size: 14px; color: rgb(102, 102, 102);"></h3>

1）添加额外标签

  <div class="warp" id="float1">    <h3>1）添加额外标签</h3>    <div class="main left">.main{float:left;}</div>    <div class="side left">.side{float:right;}</div>    <div style="clear:both;"></div>  </div>

2）使用 br标签和其自身的 html属性

<div class="warp" id="float2">    <h3>2）使用 br标签和其自身的 html属性</h3>    <div class="main left">.main{float:left;}</div>    <div class="side left">.side{float:right;}</div>    <br clear="all" />  </div>

3)父元素设置 overflow：hidden

  <div class="warp" id="float3" style="overflow:hidden; *zoom:1;">    <h3>3)父元素设置 overflow：hidden</h3>    <div class="main left">.main{float:left;}</div>    <div class="side left">.side{float:right;}</div>  </div>

4）父元素设置display:table

  <div class="warp" id="float4" style="display:table;">    <h3>4）父元素设置display:table</h3>    <div class="main left">.main{float:left;}</div>    <div class="side left">.side{float:right;}</div>  </div>