overflow:visible; 在FF里面不起作有了?FF是怎么理解overflow:visible的?
我设备了overflow:visible,在IE里面,长度会自动增长,但FF不会,
见下面的代码,在IE和FF里面 main层的长度就不一样,
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN " "http://www.w3.org/TR/html4/loose.dtd ">
<html>
<head>
<meta http-equiv= "Content-Type " content= "text/html; charset=GB18030 ">
<title> Insert title here </title>
<style type= "text/css ">
#main{border:1px solid black;width:800px; height:200px; overflow:visible;}
#a{border:1px solid red;width:200px; height:300px;float:left;}
#b{border:1px solid blue;width:300px; height:400px;}
</style>
</head>
<body>
<div id= "main ">
<div id= "a "> </div>
a
<div id= "b "> </div>
</div>
</body>
</html>
[解决办法]
你把高度设死了,这样写不太规范!不只是FF不行,IE7也会出问题的!
我的解决方法也只是
#main{
border:1px solid black;
width:800px;
height:expression(this.scrollHeight <=200:200px?this.scrollHeight+ 'px ')
overflow:visible;
}
[解决办法]
归根结底还是你写的CSS不太规范,IE6可以自动增加,但是IE7还是不可以,因为IE7要不IE6规范
[解决办法]
像ls說的一樣,因為你把高度設置死啦,如果你要設置高度,又要自增長的話,可以試試下面的樣式
#main{
border:1px solid black;
width:800px;
min-height:200px;
height:auto!important;
height:200px;
}
[解决办法]
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN " "http://www.w3.org/TR/html4/loose.dtd ">
<html>
<head>
<meta http-equiv= "Content-Type " content= "text/html; charset=GB18030 ">
<title> Insert title here </title>
<style type= "text/css ">
#main{border:1px solid black;width:800px;overflow:visible; height:1%}
#a{border:1px solid red;width:200px; height:300px;float:left;}
#b{border:1px solid blue;width:300px; height:400px;}
</style>
</head>
<body>
<div id= "main ">
<div id= "a "> </div>
a
<div id= "b "> </div>
</div>
</body>
</html>
这样就可以了,浮动闭合的问题,还有增加一个hack去掉浮动效果也可以