fuhei.net Lucars’ Blog

前端TMD总是会有出不完的问题，还总是在同一个问题上栽跟头，即便一次次重复记录在处理问题的时候依然避免不了思考片刻，譬如著名的图片垂直居中的问题。因此，好记性不如烂键盘，今后出现问题的时候会有迹可循总比再上Google搜索来得强吧。最近就又碰到了一些问题，在新博客中做些记录以备后患：

问题一、这是在做这个博客的时候发现的一个问题，万能的IE再次显示出了它的无能，虽然不是什么难题不过却总令人不爽。在一个正常流的文档当中有并列三个div分别是divTop、divMiddle、divBottom，如果divMiddle为绝对定位的元素那么对接下去的divBottom如果使用负的margin-top定位会失效[例子]。在制作例子的时候怎么也不能重现问题，经过一步步排查才发现这个问题只有在divBottom设置了高度的时候才会出现，因此解决方法很简单，只要去掉divBottom的高度设定即可，不过往往很多时候我们不能那么做。我想大概是文档流本身的问题，根据html文档流的原理设为绝对定位的元素会脱离文档流而让紧随其后的元素填充自身的位置，理论上应该不会造成定位失效所以像Firefox这类标准浏览器便完全没有上述问题，我只能认为是IE本身的bug了。而为了应对这个问题，我不得不调整文档流把divMiddle放在divBottom后面，当然这样做的最大后果便是html的语义被破坏了，还好这在我的应用当中不是大问题。——根据二八原则，至此这个问题应该告一段落了，不知道是不是我理解上有错误，有高手路过的时候记得指教。

问题二、这个问题也是伟大的IE给我们造成的困扰，不过这个问题并不发生在所有的IE浏览器上，只有在7.0版本以下的IE浏览器会出现这个问题。在《CSS权威指南》里面好似也有提到这个问题，IE6对于多类选择符的支持很有问题，经过简单的测试发现IE6在多类选择符面前只对最后一个命名的类生效因此可能会产生“伪有效”的样子，这也是为什么网络上有些同学说IE6对多类选择符是可以支持的。不过这个问题其实也要归结到我们自身架构设计的不合理上，使用多类选择符来制作CSS是比较不明智的方式，当然后果就是在今后的应用当中如果对原来的CSS不清楚便会发生制作好的页面无缘无故在IE6下不可用的情况并且很难查出根源。经过研究发现这个问题给了我一个启示，如果对IE6的hack使用这种方式做似乎便可以轻松通过CSS验证了，当然这个可用性还有待研究，况且不支持对全IE系列的hack（fuhei.net的hack方式使用了IE的条件注释工具）。——根据渐进增强的理念我还是认同CSS高级选择符、伪类和伪元素的使用的，对于打倒IE6我们坚决不能手软。

问题三、这是一个比较诡异的问题了，后来搜索网络的时候才发现这个问题是一个比较普遍存在的问题了。在使用“所见即所得HTML编辑器”来写博客、发帖子大家是否曾想过它能够导致浏览器的崩溃？在刚开始出现这类编辑器的时候我还是有一点点的担心的，但是也只是一点点而已，后来随着Rich Text Edit（后文简称RTE）的发展这一点点的担心也消失殆尽了。不过就在上周却发现即便是现在最流行的FCKeditor也会出现这个令人头疼的问题（很抱歉不能方便重现这个问题，同时忘记错误代码了，明天来贴），在某一些电脑上使用Firefox3打开RTE会导致浏览器抛出runtime error的异常，在宇宙XX同合体的google上搜索得知是因为在RTE初始化的过程当中它的父元素被置为不可见的情况引起的，因此解决方法很简单，就是保证在父元素已经在网页上可见了的情况下再初始化RTE即可。——这个问题出现在了公司网站一个常用表单的处理上，希望没有造成太大影响，现在已经被作为Firefox3的bug论处。