这几天在搞公司的新站，首页终于大功告成，不想在进行浏览器兼容性测试的时候，遇上了一个十分郁闷的问题。
为了美观，给网站的logo加了个透明的flash效果，为了不影响其他的元素，给这个flash的容器来了个绝对定位，没想到问题就出现了：所有版本的IE浏览器（包括本人正在使用的IE9 rc版本）里面，都找不到这个绝对定位的容器。这个flash失踪了！
一开始，感觉可能是flash的代码可能不兼容。因为本人一贯使用最精简的代码来插入flash，如下：
<embed src=”xx.swf” type=”application/x-shockwave-flash” pluginspage=”http://www.macromedia.com/go/getflashplayer” />
也许是flash代码出现了问题，不过冷静一想，这么长时间都没有出过问题，况且不可能影响如此广泛。通过IE中的开发者工具，检查代码。检查中，发现去掉该绝对定位元素后的任意属性后，再加上，该元素就会奇迹般的重新显示，看来这个问题实在是很诡异，应该不是CSS的问题。
于是google一下，发现了问题的根源：在IE7（从我的测试中发现，不仅仅是IE7）中，根据HTML代码编写的顺序，或者float元素的宽度或hasLayout属性，绝对定位的元素可能会消失。（原文见：http://apps.hi.baidu.com/share/detail/24865682 IE中绝对定位元素(position:absolute;)莫名消失问题）正好跟我的这个问题类似。我的logo旁边加了其他的小工具按钮的div，并进行了浮动。看来这就是问题的症结所在了。因此在它们之间插入一个空div，或把任何一个再包一层div都可以解决问题。问题的原因好像和IE的hasLayout 属性有关。于是试着将这个绝对定位的div调了一下位置，问题解决了。
恶心的IE，到了IE9还没有解决这个bug!!! 刚刚溜群发现了一幅对联，感觉用到这里很贴切：
上联：为需求而生，为用户而死，为浏览器奋斗一辈子！
下联：吃CSS亏，上JS的当，最后死在兼容上！
横批：前端人生