5 ways to clear floats in css

1. Additional labeling method

<div style=”clear:both”></div>

2. Add the overflow attribute method to the parent

可以给父级添加： overflow为 hidden|auto|scroll 都可以实现。

3. Use the after pseudo-element to clear floats

.clearfix:after {  content: "."; display: block; height: 0; clear: both; visibility: hidden;  }   
 .clearfix {*zoom: 1;}   ie6、7 专有

4.after pseudo-element empty character method

.clearfix:after {content:"\200B"; display:block; height:0; clear:both; }
.clearfix { *zoom:1; }.

5. Use before and after double pseudo elements to clear floats

.clearfix:before,.clearfix:after{ 
           content:".";
           display:table;
   }
.clearfix:after{
 clear:both;
}
.clearfix{*zoom:1;}