清除浮动似乎写css的都要用到，不过各大浏览器存在兼容性，这样我们这些CSSer们很头疼，为了一个清除浮动，甚至要写很多个代码来兼容。从实践中摸索，找到一种简单的清除浮动的办法，不单使用简单，而且FF火狐、OPera、Chrome、IE8都支持，使用时只要为需要清浮动的标签加上overflow属性即可。以下来一个完整的例子供参考：

　　CSS代码部分：

01 ul{

02 list-style:none;

03 height:auto;

04 margin:0;p

05 adding:0;

06 background-color:#436973;

07 }

08 li{

09 float:left;

10 width:80px;

11 height:80px;

12 background-color:#83B1DF;

13 }

14 .demo{

15 clear:both;

16 border:1px solid #FF00FF;

17 margin-bottom:5px;

18 }

19 .overflow{

20 overflow:auto;

21 zoom:1;

22 background-color:#43FF73;

23 }

24 ul{

25 list-style:none;

26 height:auto;

27 margin:0;

28 padding:0;

29 background-color:#436973;

30 }

31 li{

32 float:left;

33 width:80px;

34 height:80px;

35 background-color:#83B1DF;

36 }

37 .demo{

38 clear:both;

39 border:1px solid #FF00FF;

40 margin-bottom:5px;

41 }

42 .overflow{

43 overflow:auto;

44 zoom:1;

45 background-color:#43FF73;

46 }

HTML代码部分如下：

view sourceprint?01 <div class="demo">

02 <ul class="overflow">

03 <li>1</li>

04 <li>2</li>

05 <li>3</li>

06 <li>4</li>

07 <li>5</li>

08 <li>6</li>

09 <li>7</li>

10 <li>8</li>

11 <li>9</li>

12 </ul>

13 </div>

14 <div class="demo">

15 <ul>

16 <li>1</li>

17 <li>2</li>

18 <li>3</li>

19 <li>4</li>

20 <li>5</li>

21 <li>6</li>

22 <li>7</li>

23 <li>8</li>

24 <li>9</li>

25 </ul>

26 </div>