漏网之鱼——TT带来的痛苦挣扎
这几天和本部一个兄弟夏先生合作完成华师大的亚运志愿者网站。由于说好我负责ASP部分，所以拿到本部发来的页面后只是顺手用360安全浏览器看了一下，毫无疑问，页面设计得很漂亮，这充分说明我们的分工是正确的——起码对于美工来说，夏先生比我好。
没有过多考虑，匆匆忙忙开始拷代码，花了一天多的时间，期间与本部进行了n次的交流，基本完成了页面功能。并上传到了服务器。心里还一个劲地感慨：合作的力量还真是强大啊。因为之前总是一个人做整个网站，基本上都得拖几个星期，就页面的设计已经能累死人了。现在有个人帮忙写css，效果的确不错。这充分说明，独行侠的年代已经过时了。当然，剩下的事可以说不是我的事了，我可不想无聊到做上传文章之类的事。
没想到的是昨晚同是亚运网络小组的梁兄突然说网站有问题，看了一下，原来用的是腾讯的TT浏览器。这才突然想起做完整个页面后都没有在各个浏览器上做过相关测试。事实上我的电脑上并没安装TT，这是个很大的漏洞，因为腾讯的爪牙现在几乎是伸遍了中国任何一台能上网的PC，TT浏览器使用量还是相当可观的，而我之前测试页面居然一直没有留意到真是吓了一跳。忙回来下了一个安装。事实证明，页面在TT上确实是存在问题的。有这么几个div的嵌套：
<div>
<div style="float:left;">框一</div>
<div style="float:left;">框二</div>
</div>
在IE8上，呈现出来的页面是理想的：框一在框二的左边。但在TT上，框二却掉到了框一的下面。原本以为又是浏览器不兼容的问题，决定用css hack解决。Google了一番，却发现到此都说TT使用的是IE的核心，因而只要页面在IE上显示正常，在TT上也应该是正常的，所以TT没有特定的css hack可写。这真是见鬼了，因为在我的电脑上，整个页面在IE（win7的IE版本是IE8）上是很正常的，照上面的理论，TT上也应该正常才是。怀着不服气的心理检查了半天的css，发现没有任何问题，情绪无比低落。就在准备投降的时候，突然灵感光顾，顺手打开了IETester，先用IE6试验，发现整个页面几乎都是变形的，面红耳赤地赶紧关掉，幸好这些问题可以用css hack解决，算不上问题，又顺手用IE7试验了一下，瞬时气不打一处来。这个页面在ie7下的bug和TT上的错误是完全一致的。这么说来，TT使用的内核应该是ie7的内核，而不是我系统上的ie8的内核，这到底是什么原因，有待了解。但既然是ie7的内核，问题就好解决多了，起码我可以使用ie7的css hack来处理，这比起无从下手要简单N倍了。
记得韩寒有句很经典的话：灵感就像公共汽车，不来的时候一部都没有，一来的时候几部一起来。此时我突然又想起应该在TT上查看一下页面的源代码，起码能知道asp输出的html是不是有问题的。检查之后，发现了一个很重要的线索：如上所述的两个div，放的都是用asp生成的一个标题列表，这些列表是用table包围起来的，如下：
<div class="pack">
<div style="float:left;" id="div1">
<table><tr><td style="width:100%">XX的标题</td></tr></table>
</div>
<div style="float:left;" id="div2">
<table><tr><td style="width:100%">XX的标题</td></tr></table>
</div>
</div>
问题出在width:100%上，重复检查了一下css，发现夏兄没给div1和div2定义width，而我写asp的时候，却给td输出了一个wdith=100%的属性，所以div1就把整个pack的width占据了，div2自然只好放到了下面。明白了道理，解决起来就简单得不得了了，只要给div1和div2加一个width的属性，问题解决。
这件小事说明了发散性的思维是很重要的，如果我一味地去检查CSS或试图发现TT的css hack，可能这个问题是搞不定了。
但说来说去，到底TT为什么会用ie7的内核而不是系统上的ie8的内核，哈哈，鬼知道。
补记：写这篇日志之后的若干星期，无意中在IE的“开发人员工具”里发现了一个浏览器模式设置，骇然有IE7可选，可见WIN7不仅有IE8内核，还有IE7的。CS兄又指教说：如果系统用的是IE8的话，那么无论什么傲游360TT搜狗之类的外壳浏览器统统都是用IE7模式渲染的，所以一般来说为了省事我都在正式发布页面时給meta加上一句强制让IE8也用IE7模式来渲染……这个方法真是个好办法，学习学习！！
这几天和本部一个兄弟夏先生合作完成华师大的亚运志愿者网站。由于说好我负责ASP部分，所以拿到本部发来的页面后只是顺手用360安全浏览器看了一下，毫无疑问，页面设计得很漂亮，这充分说明我们的分工是正确的——起码对于美工来说，夏先生比我好。
没有过多考虑，匆匆忙忙开始拷代码，花了一天多的时间，期间与本部进行了n次的交流，基本完成了页面功能。并上传到了服务器。心里还一个劲地感慨：合作的力量还真是强大啊。因为之前总是一个人做整个网站，基本上都得拖几个星期，就页面的设计已经能累死人了。现在有个人帮忙写css，效果的确不错。这充分说明，独行侠的年代已经过时了。当然，剩下的事可以说不是我的事了，我可不想无聊到做上传文章之类的事。
没想到的是昨晚同是亚运网络小组的梁兄突然说网站有问题，看了一下，原来用的是腾讯的TT浏览器。这才突然想起做完整个页面后都没有在各个浏览器上做过相关测试。事实上我的电脑上并没安装TT，这是个很大的漏洞，因为腾讯的爪牙现在几乎是伸遍了中国任何一台能上网的PC，TT浏览器使用量还是相当可观的，而我之前测试页面居然一直没有留意到真是吓了一跳。忙回来下了一个安装。事实证明，页面在TT上确实是存在问题的。有这么几个div的嵌套：
<div>
<div style="float:left;">框一</div>
<div style="float:left;">框二</div>
</div>
在IE8上，呈现出来的页面是理想的：框一在框二的左边。但在TT上，框二却掉到了框一的下面。原本以为又是浏览器不兼容的问题，决定用css hack解决。Google了一番，却发现到此都说TT使用的是IE的核心，因而只要页面在IE上显示正常，在TT上也应该是正常的，所以TT没有特定的css hack可写。这真是见鬼了，因为在我的电脑上，整个页面在IE（win7的IE版本是IE8）上是很正常的，照上面的理论，TT上也应该正常才是。怀着不服气的心理检查了半天的css，发现没有任何问题，情绪无比低落。就在准备投降的时候，突然灵感光顾，顺手打开了IETester，先用IE6试验，发现整个页面几乎都是变形的，面红耳赤地赶紧关掉，幸好这些问题可以用css hack解决，算不上问题，又顺手用IE7试验了一下，瞬时气不打一处来。这个页面在ie7下的bug和TT上的错误是完全一致的。这么说来，TT使用的内核应该是ie7的内核，而不是我系统上的ie8的内核，这到底是什么原因，有待了解。但既然是ie7的内核，问题就好解决多了，起码我可以使用ie7的css hack来处理，这比起无从下手要简单N倍了。
记得韩寒有句很经典的话：灵感就像公共汽车，不来的时候一部都没有，一来的时候几部一起来。此时我突然又想起应该在TT上查看一下页面的源代码，起码能知道asp输出的html是不是有问题的。检查之后，发现了一个很重要的线索：如上所述的两个div，放的都是用asp生成的一个标题列表，这些列表是用table包围起来的，如下：
<div class="pack">
<div style="float:left;" id="div1">
<table><tr><td style="width:100%">XX的标题</td></tr></table>
</div>
<div style="float:left;" id="div2">
<table><tr><td style=""width:100%"">XX的标题</td></tr></table>
</div>
</div>
问题出在width:100%上，重复检查了一下css，发现夏兄没给div1和div2定义width，而我写asp的时候，却给td输出了一个wdith=100%的属性，所以div1就把整个pack的width占据了，div2自然只好放到了下面。明白了道理，解决起来就简单得不得了了，只要给div1和div2加一个width的属性，问题解决。
这件小事说明了发散性的思维是很重要的，如果我一味地去检查CSS或试图发现TT的css hack，可能这个问题是搞不定了。
但说来说去，到底TT为什么会用ie7的内核而不是系统上的ie8的内核，哈哈，鬼知道。
补记：写这篇日志之后的若干星期，无意中在IE的“开发人员工具”里发现了一个浏览器模式设置，骇然有IE7可选，可见WIN7不仅有IE8内核，还有IE7的。CS兄又指教说：如果系统用的是IE8的话，那么无论什么傲游360TT搜狗之类的外壳浏览器统统都是用IE7模式渲染的，所以一般来说为了省事我都在正式发布页面时給meta加上一句强制让IE8也用IE7模式来渲染……这个方法真是个好办法，学习学习！！