• Register

IE6中min-width无效的解决方法

问题来源于对dvbbs模板的修改,发现它的CSS对整体宽度控制是很简单的,原代码如下:

.mainbox { margin-top:10px; width:97%; min-width:960px; clear:both;}

    当改动其中的97%时,对正屏用户在IE6中会出现页面的扭曲,改动如下:

.mainbox { margin-top:10px; width:97%; min-width:960px; width: expression((documentElement.clientWidth < 960) ? "960px" : "auto" ); clear:both;}

    我这里限制Min-width最小宽度为960,当小于这个值时,我让它自动大小,但又出现新问题了,我测试ie7、ie8、firefox3、Opera、Safari都可以正常显示960px,但基于ie6的比如ie6、360se,世界之窗等页面大小显示并不是960px,而是100%全屏,如果你觉得没什么问题就好,如果你想都显示960px宽度,那就可以把其中的auto改为960px。

    如此折腾,实现自适应布局时可以保证布局不小于一定宽度,同时宽屏或窄屏窗口被用户拖窄后不会出现布局自动换行。

.mainbox { margin-top:10px; width:10%; min-width:960px; width: expression((documentElement.clientWidth < 960) ? "960px" : "auto" ); clear:both;}

    同样道理,如果想设置最大宽度max-width同样可用以下CSS代码(针对Ie6):

_width:expression((documentElement.clientWidth >1200) ? "1200px" : "auto" );

    最后总结:平时看别人的CSS hack,一般都随手关了,轮到自己郁闷时,想想,还是记录下来吧。。。

版权声明:转载请注明来自杨俊伟博客,本文地址:http://yangjunwei.com/a/386.html
除非注明,杨俊伟博客文章均为原创,转载请注明出处和链接!
 

发表评论 

2 条评论 »

  • Firm
    2010/01/31 at 16:37:36

    恩,重新定义例外又很麻烦,所以我有时就提示IE6的不照顾了,要看网站的自己升级

    nuodou 于 2010-2-5 9:14:18 回复

    有好有坏,看个人需要了

  • Firm
    2010/01/29 at 20:02:44

    俺上次搞博客大巴的CSS也遇到过

    nuodou 于 2010-1-30 10:06:19 回复

    部分css在IE6中真的很郁闷!此招有利有弊,谁用谁体会呵呵

我还是想用邮箱注册

登录

忘记密码 ?

用第三方帐号快捷登录

已有账户?前往登录吧~

注册