交互设计中心-72色

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

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

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

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

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

内容过少时：

内容过多时：

转自：空格