挽救杯具
昨天,知道了原来我们粮库也有网站,迫不及待地去观摩一下。汗!我用的是FF,结果呢?中国人做的网页就是对IE以外的浏览器水土不服,于是,汗,再汗……
网页是个需要测试测试再测试的东西,内容当然很重要,但如果不同用户不同浏览器出来的效果不一样呢?杯具……在中国人设计的网页中,非IE不可是习惯性真理性的,比如说大名鼎鼎的备案网站,又比如同样如雷贯耳的网上支付网站,巨汗!地球人都知道IE的安全性不好,速度不优秀,但,勤劳勇敢机智过人的中国人就喜欢用系统自带原汁原味,甚至还没经过升级到7或8的IE,果然是微软的忠实粉丝啊!
但,我们某些人的思维是发散的,面向的是世界各地的盆友。在外国盆友设计的网页中,基本上FF横行,是推荐用浏览器,比如说我用的WP模板的作者。显然,他老人家视IE为无物。请看下图:
左图是我千辛万苦经过修改后的IE适应版,右边是原版。杯吧,原版在IE下,3栏的设计都变成2栏了,2个侧栏“被迫”挤到了一块,肯定是和背景不搭调的,揪心啊!
为了挽救这恐怖的杯,我首先请来了Firebug大人。
模板,显然,是div的,样式肯定是CSS的,而问题就发生在content-body、content-sidebar-2和content-sidebar里。首先,我在content-sidebar的CSS里加了一句“float:right;”,解决了content-sidebar在IE里跟在content-sidebar-2屁股后面的问题,实现右置。但为什么升不上去呢?难道因为太窄?我尝试修改过很多宽度都不行,看来不是位置不够的问题。会不会是content-sidebar里有“clear”的命令呢?应该不会。如果有的话,在FF就不会正常了。中间部分三栏设计,我们可以用3个float来解决问题,于是我试探性地在content-sidebar-2里加一句“float:right;”惨了,占到了最右方,当然,因为它的层在content-sidebar之前,理所应当占最右边。那如果改为“float:left;”呢?我的设想是它或许会正常,如果content-body已经设定为“float:left;”的话,怪异的是,在IE下正常,在FF下content-sidebar-2抢到了正文的左边。问问Firebug,虫子说content-body里有个“float:none;”的设置。怎么可能,我已经把CSS文件里所有content-body都加上“float:left;”,怎么有可能还是“float:none;”!!!!但如果不存在,Firebug不可能爬虫出来,到底在哪里呢?无计可施之下,找起了网页源文件,居然,居然被我在网页头部找到这等东西!!!
实在太杯具,灰常杯具啊!文件头,居然放在文件头,无语了。在WP的header里找,没找到,最后终于在function里找着,我的老天,该死的“none”!于是,终于用3句float解决了IE怪异的效果,让中国人看到的效果和外国人相似。
哎,如果大家用订阅的话,版面什么个鬼样又有什么关系呢。