Question

如何解决Firefox下DIV无法自动纵向拉伸(自动适应高度)

Answer 1

怎么办呢？其实，在Firefox下，如果内层的DIV都是“漂浮”的，也就是说都有类似float:left margin:0 auto;的属性，那么外层的DIV高度就不会自动拉高，原来是多高，还是多高！解决办法就是清除漂浮属性，但是有时候呢，还不想清除漂浮属性，怎么办呢？光说，可能也说不太明白，看个例子吧：<style type="text/css">
.out {width:500px;
height:100px; background:#000000;}
.in {width:200px;
height:200px;
float:left;
background:#eecc33;}</style><div class="out">
</div> 把上面的代码存成.html格式，再分别用IE和Firefox打开，就能看出区别了：在Firefox下，虽然内层的IDV高度为200px，但是外层的 DIV的高度还是100px，没有变化，也就是说不能自动拉高！而在IE下就不会有这种问题，外层的DIV自动拉高为200px。现在，再在<div class="in"></div>下面加一行：<div style="clear:both;"></div>，再分别在IE和Firefox下看看效果如何呢？是不是在Firefox下也可以自动纵向拉伸了呢？ 其实，解决这个问题的的方法就是清除漂浮，具体代码的使用比较灵活，未必就一定使用小一说的这种形式，具体问题具体分析嘛，呵呵！