经常遇到这样的问题,左右结构的网页上,两边的背景不同,而为主的大容器因为需求需要在内容过少时与小容器的高度一致。这样就造成了各浏览器的兼容问题:如果设定主容器的高度,在IE7和FF下会显示成如下图:
如果单独使用min-height,在IE7和FF下可以实现想要的效果,但IE6下没有这个属性,不起作用,和没有设定高度的效果是一样。IE6效果如下图:
既然如此,不要忘记还有一个重要的可以区分IE6和IE7的!important,于是有了下面的想法:
height:600px;height:auto !important; min-height:600px;
这样得到的效果在IE6,IE7,FF下均如下图:
内容过少时:
内容过多时: