css清除浮动最佳姿势

<style type="text/css"> 
.div-f{background:#000080;border:1px solid red;} 
.div-t{background:#800080;border:1px solid red;height:100px;margin-top:10px} 
.left{float:left;width:20%;height:200px;background:#DDD} 
.right{float:right;width:30%;height:80px;background:#DDD} 
/*清除浮动代码*/ 
.clearfloat:after{display:block;clear:both;content:"";visibility:hidden;height:0} 
.clearfloat{zoom:1} 
</style> 
<div class="div-f clearfloat"> 
<div class="left">Left</div> 
<div class="right">Right</div> 
</div> 
<div class="div-t"> 
div2 
</div> 
IE8以上和非IE浏览器才支持:after, 可解决ie6,ie7浮动问题