我们知道标准浏览器是支持min-height这个CSS属性的,但是在IE6中却不被认可。在我上次做主题的时候刚好遇见这个问题,今天就来讨论一下。看下图(右),要求是这样的:

innerBox(高度自适应)里面有两个浮动div元素(what and why),”why盒子”高度固定内容固定,”what盒子”内容不固定,想要解决”what盒子”必须延深与innerBox一致的问题,看到这里大多数人会想起自己博客的布局了吧,呵呵,这个技巧可是很常用的哦。显然解决这个问题的最好方法就是实现最小高度(min-height)。
最重要的一点是 : what内容高度小于why时如何让它在IE6中模仿min-height的效果。
而需要我们了解的一点是 : IE6中元素的height,width会随着它里面内容的增加面自动扩大
当我们在what中加入一条CSS规则 使它的高度和why一致就可以搞定IE6了,内容过多它会处适应而不是溢出,但是当内容增加时在FireFox标准浏览器里面会出现上图(左)所示FF中的溢出情况。
我们给what盒子加上min-height让它的最小高度和why一样,这时就好了。不过这时候我们应该把刚才为了搞定IE6加上的height值做成hack让它只在IE6中起作用,方法很简单在height属性值前加上下划线”_” OK搞定。
最小高度min-height的浏览器兼容方法
最爱啊
yg22.com
学了一点知识,这个最重要,我一直想不通,哈哈!!!!!
不知道min-heght这个属性在ie7里兼容不兼容,由于ie6里不兼容 我一直没有用这个属性
@Eagle IE6以上的标准浏览器都是可以的.
IE6支持下划线,IE7和firefox均不支持下划线,这样就可以啊
又从博主这学了一招!
@0cai 对啊,下划线是IE6特有的,IE7的是加号”+”..呵呵.
hack有时会有必要去用,谁叫IE还不够标准.
只要是xhtml结构合理,CSS控制能力强.hack只需要很少就够了^!^
好东西啊!每次写CSS的时候都出现这问题,这回知道怎么回事了!哈哈
呵呵.我做主题的时候经学用到所以就放出来了^!^
又是IE6,期待博主讲讲round corner
@博译论 下回有时间总结一下哈^!^