经常出现子标签浮动（float），父div不能自适应的问题，如下面的代码，li是float：left，外面div高度自适应

`

-

白芍

-

丹参

-

红景天

-

姜黄

`

解决方法：

1）在子标签的最后加上清除浮动的标签

可以在ul的下面加上以下代码，清除浮动

`

`

2)给div加css属性

`

.product

{

overflow:auto;

zoom:1;

}

`

overflow:auto;是让高度自适应， zoom:1;是为了兼容IE6，也可以用height:1%;的方式来解决。

3)使用after伪类

`

.product:after

{

content:”.”;

height:0;

visibility:hidden;

display:block;

clear:both;

}

`

4)浮动外部元素，float-in-float

这种做法就是让父容器也浮动，这利用到了浮动元素的一个特性——浮动元素会闭合浮动元素。这种方式在 IE/Win 和标准兼容浏览器中都有较好的效果，但缺点也很明显——父容器未必想浮动就浮动的了，毕竟浮动是一种比较特殊的行为，有时布局不允许其浮动也很正常.

推荐使用前两种方法！！