关于min-height的IE6及以下浏览器的Hack

刚做网站的时候遇到一个浏览器最小高度min-height 在IE6中不能自动伸展的问题,通过谷歌搜索了一下子,找到了答案...

例如:
#container{
height:500px;
background:#00F
}
#page{
min-height:500px;
background:#F00
}

page层内容少,页面很矮,加了min-height后FF与IE7.0中page层可以覆盖住container的背景色。而IE6及以下min-height无法辨认,所以露出了我不想让他露出来的container层的红色背景。

最简单的办法还是hack吧
#page{
background:#F00;
min-height:500px;
height:auto !important;
height:500px
}
这样IE6中page的确有了最小高度,能覆盖住container,但是其实也只有500px这么一个高度,等到内容多了这个page也不会自动拉长了,这样不行,折腾多时,终于找到个方法可以解决IE又有最小高度又能自动拉伸的目标:
#page{
background:#F00;
min-height:500px;
height:auto !important;
height:500px;
overflow:visible
}
就是这句overflow:visible使IE们能够当作height:auto来处理,问题解决.

查看 CSS hack height min-height的相关文章

转载本站原创文章请注明:文章转自 挨踢路,链接: https://itlu.net/articles/1329.html

评论列表(5条)

  1. 加入埋葬IE6的行列吧,IE6是伟大的,但是他该退休了。

  2. 回复JashionJashion

    overflow:visible
    这句可有可无
    因为默认就是这个

  3. 恩,学习中...现在考虑IE6确实是件麻烦的事。

  4. 默认的就是visible啊

  5. 记错了,默认是auto,但如果把height:500px;改为_height:500px;的话更好。

添加评论

您好,#请填信息# 确定

打赏请博主喝水
LOADING