当前位置: 首页 > 图文教程 > 网页制作 > CSS样式表 > IE6不支持CSS中的min-width/height属性问题的解决方法

CSS样式表
论WEB标准在中国的灰飞烟灭
CSS 清除浮动元素方法 整理
css FF与IE兼容性总结
div css 鼠标悬停在div层上时,div背景色改变
IE6不支持CSS中的min-width/height属性问题的解决方法
CSS 自动定位 的应用
CSS 样式命名规则
IE7下生成高质量CSS缩略图
编写CSS代码时样式的命名规则
用css来实现透视效果
word-wrap
div+css排版的样例
HTML结构化:实践DIV+CSS网页布局入门指南
CSS锦囊
DIV_圆边圆角的实现
凹陷文字 推荐
自定义容器和字体大小
IE最新的欺骗代码
ASP+CSS 实现列表隔行换色
无边框表格

CSS样式表 中的 IE6不支持CSS中的min-width/height属性问题的解决方法


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-09-11   浏览: 129 ::
收藏到网摘: n/a

这么好的语法,偏偏IE 6不支持,不过说不支持也不准确,事实上IE6本身在指定height与width的值时,就具有min-width和min-height的特性,只是如果单纯用height或width来指定,到了Firefox或IE 7时,又会把它当作是锁死的值,不会因內容增加而扩大元素的box。
解决的方法先看语法。
最小高度的解決

代码如下:

.Elm {
min-height:100px;
height: auto !important;
height: 100px;
}

最小宽度的解決

代码如下:

.Elm {
min-width:100px;
width: auto !important;
width: 100px;
}

里面的秘诀,是先利用较新的浏览器识别min-width/height,透过它来指定值,而IE6则是透过width/height取值。
不过这里有个冲突,就是新的浏览器也识别width/height,因此min-width/height会被width/height改写,解決的办法,就是中间那一行。
height: auto !important;(以及width: auto !important;)
由于它标示!important,所以下面那行height无法取代上面这一行,见解变成新的浏览器忽视掉第三行,而让高度不受第三行影响。
另外由于IE6不识别 min-height和 !important属性,所以它还是取第三行的语法,这样就可以相安无事,皆大欢喜。