兼容的最小高度适应不定量内容的容器

五月 15, 2008 06:47 by Esun

经常遇到这样的问题,左右结构的网页上,两边的背景不同,而为主的大容器因为需求需要在内容过少时与小容器的高度一致。这样就造成了各浏览器的兼容问题:如果设定主容器的高度,在IE7和FF下会显示成如下图:

clip_image002

如果单独使用min-height,在IE7和FF下可以实现想要的效果,但IE6下没有这个属性,不起作用,和没有设定高度的效果是一样。IE6效果如下图:

clip_image004

既然如此,不要忘记还有一个重要的可以区分IE6和IE7的!important,于是有了下面的想法:

height:600px;height:auto !important; min-height:600px;

这样得到的效果在IE6,IE7,FF下均如下图:

内容过少时:

clip_image006

内容过多时:

clip_image008

Tags:
Categories: Web技术
Actions: 评论 (2) |

评论

非法操作猫 说:

五月 15. 2008 14:05

呵呵,好文章,申请友情链接 www.ueday.com
我已经加你了哦·~~

360 说:

六月 18. 2008 00:19

过来看看,交个朋友,有空到我空间来,谢谢
有兴趣换个链接http://www.360abc.org.cn

添加评论



()  

  Country flag



Live preview

 说:

七月 23. 2008 19:40