当前位置：首页 → 问答吧 → IE6不支持max-width和min-width该怎么办！！！

IE6不支持max-width和min-width该怎么办！！！

时间：2009-10-26

来源：互联网

大家有什么好办法啊？还有mix-height和max-height IE6是不是支持的呢？我没有测试！！！

作者: rao3324180 发布时间: 2009-10-26

ie6确实不支持对于min-height我一般是直接给ie6设置height， ie6会当做最小高度来处理，如果内部元素的尺寸超出了，会自动撑大父元素
例如：
div {min-height:300px;height:auto !important;height:300px;}
这样写的话 ie6会读取height:300px;而忽略height:auto；等于给ie6里设置了一个最小高度；
而其他浏览器会读取height:auto;和min-height:300px;
至于最大高度...我不知道有什么好办法。
同问...

作者: kapiter 发布时间: 2009-10-26

引用:

原帖由 kapiter 于 2009-10-26 23:05 发表
ie6确实不支持对于min-height我一般是直接给ie6设置height， ie6会当做最小高度来处理，如果内部元素的尺寸超出了，会自动撑大父元素
例如：
div {min-height:300px;height:auto !important;height:300px;}
这 ...

谢谢!!!

作者: rao3324180 发布时间: 2009-10-26

二楼说的针对ie6必须加上这个overflow: visible;

作者: mrwll 发布时间: 2009-10-26

加overflow:visible会出现滚动条，影响美观的，可以使用js来控制。

作者: happyqian 发布时间: 2009-10-28

我看他们都是这样
width: expression(this.width > 300 ? 300 : true); height: expression(this.height > 300 ? 300 : true); max-width: 300px; max-height: 300px;

作者: ooosu 发布时间: 2009-10-28

6楼的方法不错,学习了!
不过就担心禁用js后页面就飞了

作者: kapiter 发布时间: 2009-10-28

这是CSS expression
耗资源
且包括ie8在内的大多浏览器都不支持。

作者: ONEBOYS 发布时间: 2009-10-28

ie6下的min-width的模拟方法是有的，不过偏复杂。不用也罢。expression么，本人一直很排斥

作者: ONEBOYS 发布时间: 2009-10-28

回复 8# ONEBOYS 的帖子:

我感觉单独给一个元素用expression 应该不是很耗资源吧
另外这一句就是写给ie6看的别的浏览器不需要支持认识max-height就好

作者: kapiter 发布时间: 2009-10-28

嗯，刚忘了LZ的问题了。
看见expression，就发意见了。

如果真的要实现ie6的min-width，综合考虑这种方法还是最佳的了。

作者: ONEBOYS 发布时间: 2009-10-28

给你一段JS，是国外一个老外写的，可以支持IE6 max-width,max-height,min-width.min-height属性，这个方法不一定会比楼上几位说的在CSS里面加expression()好，但是这个方法调用比较简单，直接在头部<head></head>之间加这样一句话就行，<script type="text/javascript" src="minmax.js"></script>。我下面有一个样例，由于没有服务器，JS不能直接调用，你把代码复制下来，把附件里的minmax.rar下载下来，解压出来跟你复制下来的代码放在一起运行一下就知道效果了。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>minmax.js example page</title> <style type="text/css"> body{ font-family:Arial, Helvetica, sans-serif; font-size:13px; } .wrap{ margin:0 auto; width:90%; border:1px solid #F30; padding:10px; max-height:60px; overflow:auto; } </style> <script type="text/javascript" src="minmax.js"></script> </head> <body> <div class="wrap"> This element normally takes up 90% of the window width, but it will always be at least 16em wide, and never wider than 32em. Also, it will always be at least 150px high, possibly higher if there is more text. Furthermore, lorem ipsum dolor sit amet thingy thing lorem lorem lorem flippin' lorem where's my textfile full of greeking when I need it? Lorem lorem lorem lorem rhubarb rhubarb and a lorem.<br /> This element normally takes up 90% of the window width, but it will always be at least 16em wide, and never wider than 32em. Also, it will always be at least 150px high, possibly higher if there is more text. Furthermore, lorem ipsum dolor sit amet thingy thing lorem lorem lorem flippin' lorem where's my textfile full of greeking when I need it? Lorem lorem lorem lorem rhubarb rhubarb and a lorem. http://hi.baidu.com/wely_ton http://hi.baidu.com/wely_ton http://hi.baidu.com/wely_ton http://hi.baidu.com/wely_tonThis element normally takes up 90% of the window width, but it will always be at least 16em wide, and never wider than 32em. Also, it will always be at least 150px high, possibly higher if there is more text. Furthermore, lorem ipsum dolor sit amet thingy thing lorem lorem lorem flippin' lorem where's my textfile full of greeking when I need it? Lorem lorem lorem lorem rhubarb rhubarb and a lorem.<br /> This element normally takes up 90% of the window width, but it will always be at least 16em wide, and never wider than 32em. Also, it will always be at least 150px high, possibly higher if there is more text. Furthermore, lorem ipsum dolor sit amet thingy thing lorem lorem lorem flippin' lorem where's my textfile full of greeking when I need it? Lorem lorem lorem lorem rhubarb rhubarb and a lorem. http://hi.baidu.com/wely_ton http://hi.baidu.com/wely_ton http://hi.baidu.com/wely_ton http://hi.baidu.com/wely_tonThis element normally takes up 90% of the window width, but it will always be at least 16em wide, and never wider than 32em. Also, it will always be at least 150px high, possibly higher if there is more text. Furthermore, lorem ipsum dolor sit amet thingy thing lorem lorem lorem flippin' lorem where's my textfile full of greeking when I need it? Lorem lorem lorem lorem rhubarb rhubarb and a lorem.<br /> This element normally takes up 90% of the window width, but it will always be at least 16em wide, and never wider than 32em. Also, it will always be at least 150px high, possibly higher if there is more text. Furthermore, lorem ipsum dolor sit amet thingy thing lorem lorem lorem flippin' lorem where's my textfile full of greeking when I need it? Lorem lorem lorem lorem rhubarb rhubarb and a lorem. http://hi.baidu.com/wely_ton http://hi.baidu.com/wely_ton http://hi.baidu.com/wely_ton http://hi.baidu.com/wely_tonThis element normally takes up 90% of the window width, but it will always be at least 16em wide, and never wider than 32em. Also, it will always be at least 150px high, possibly higher if there is more text. Furthermore, lorem ipsum dolor sit amet thingy thing lorem lorem lorem flippin' lorem where's my textfile full of greeking when I need it? Lorem lorem lorem lorem rhubarb rhubarb and a lorem.<br /> This element normally takes up 90% of the window width, but it will always be at least 16em wide, and never wider than 32em. Also, it will always be at least 150px high, possibly higher if there is more text. Furthermore, lorem ipsum dolor sit amet thingy thing lorem lorem lorem flippin' lorem where's my textfile full of greeking when I need it? Lorem lorem lorem lorem rhubarb rhubarb and a lorem. http://hi.baidu.com/wely_ton http://hi.baidu.com/wely_ton http://hi.baidu.com/wely_ton http://hi.baidu.com/wely_ton </div> </body> </html>
提示：您可以先修改部分代码再运行