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,一般都随手关了,轮到自己郁闷时,想想,还是记录下来吧。。。