三种方式实现firefox div自动适应内容高度

三种方式实现firefox div自动适应内容高度

IE不管设置div的高度与否，都会根据内容来自适应高度。但是FIrefox就不会。

1.用min-height实现firefox div自动适应内容高度功能
如果div想要一个最小高度，那么应该用css的min-height这个属性，但是IE不支持，考虑到大多数用户都使用IE，所以一般情况下这个属性基本上弃置不用。在IE里面，height基本上就可以当作minheight来用，因为如果内容超出height，IE会自适应其高度。但是一旦设置了 height以后，FIrefox就不会自适应div的高度了。所以只能两个属性都不用，干干净净地写<div>爱问知识人</div>。

2.用内容里最后加clear:both实现firefox div自动适应内容高度功能

即使不设置固定高度，Firefox对高度的自适应也不那么尽人意。如果需要在一个层内嵌套一个需要float来规定的层，那它就又失灵了。其实有个最简单的方法，就是在div内的最下面加一个clear:both的div。例如：

<div>
<div style="float:left;">爱问知识人</div>
<div style="float:right;">www.awzsr.com</div>
<div style="clear:both;"></div>
</div>

3.用JS解决代码实现firefox div自动适应内容高度功能
document.getElementById("firstindex_left").style.height = document.getElementById("pmain").offsetHeight + "px";