min-height最小高度的实现(兼容IE6、IE7、FF)(解决IE6不兼容min-height)
2010-11-20 16:44:58 来源:WEB开发网核心提示:CSS兼容IE6,IE7,FF的技巧http://tech.cncms.com/sheji/divcss/48311.html兼容IE6/IE7/IE8/FireFox的CSS hackhttp://tech.cncms.com/sheji/divcss/48262.html 布局过的人都知道CSS的最小高度min-
http://tech.cncms.com/sheji/divcss/48311.html
兼容IE6/IE7/IE8/FireFox的CSS hack
http://tech.cncms.com/sheji/divcss/48262.html
布局过的人都知道CSS的最小高度min-height是个很有用的属性,它可以让很短的内容也有一个很合适的高度,使页面显得美观。但很可惜IE6不支持这一属性。怎么办呢?我们可以用另外一种方法让IE6也有最小高度min-height属性的效果。
众所周知,如果内容超过元素的高度,那么IE6是会自动增加元素的高度,即使你明确的定义了元素的高度。我们可以利用IE6的这个bug来让IE6也有最小高度min-height属性的效果。
E6对于overflow的特殊实现,给我们实现min-height提供了一个思路,所以产生了以下兼容IE6、IE7、FF浏览器的min-height写法:
mrjin { background:#ccc; min-height:100px; /*高度最小值设置为:100px*/ height:auto !important; /*兼容FF,IE7也支持 !important标签*/ height:100px; /*兼容ie6*/ overflow:visible; }
解释:
1、由于IE6对!important的解释存在bug,所以它只识别height:500px这一句,超过500px后,IE6自身会增加盒子的高度;
2、IE7和其他标准浏览器三句都能识别,虽然定义height:500px,但我们又有了height:auto !important,所以超过500px也能自动增加盒子的高度。
最大宽度...主流浏览器IE对max-width是不支持的,对这一属性的设置在IE中是无效的。同样的对min-width的设置也是无效的(只能用JS处理)。
- ››兼容IE6的纯CSS背景半透明文字不透明
- ››ie6下面关于html编码问题导致的js出错,css不被应用...
- ››ie7以下 tr元素的背景图片作用域
- ››IE6-8 filter双重滤镜bug
- ››ie6中fixed不起作用的问题
- ››ie6下图片透明变灰色的解决方案
- ››IE6\IE7\IE8支持HTML5标签
- ››兼容ie6浏览器窗口四角固定背景代码
- ››兼容FF和IE的html传递参数给swf的方法
- ››min-height最小高度的实现(兼容IE6、IE7、FF)(...
- ››兼容IE和Firefox的设为首页和收藏的Javascript代码...
- ››IE6及以上版本上的随屏幕移动而移动的代码
更多精彩
赞助商链接