IE7与web标准设计（3）

何以称之为“祸首”
这篇文章的题目中，将这个bug称之为“引起页面布局混乱的祸首”。能被称之为“祸首”，自然有其“强悍”的地方。那它到底强悍在什么地方呢？其实，很简单，就3条：

无论是“宽度”的内容过长，还是“高度”的内容过长，都会引发此bug。 无论是文字、图片，还是任意有宽度和高度概念的“可见元素”，它们的“过宽”和“过高”都会引发此bug。 任意有宽度和高度概念的“可见元素”,它们在默认状态下的“overflow”样式的值都是“Visible”（即使你没有设置这个样式）。

有些朋友可能会问，你怎么知道任意有宽度和高度概念的“可见元素”,它们在默认状态下的“overflow”样式的值都是“Visible”的呢？
其实方法很简单，利用IE Developer Toolbar这个工具就可以知道了。下面的文章和截图，可能会对你有帮助：
文章： 《介绍两个,b/s开发中我常用到的小工具》
截图：

图：利用“IE Developer Toolbar”得到元素样式的默认值
如何修复bug
其实这个bug，我们还是有办法修复的，但都不是很完美的解决方案，想要取得较好的效果，还需要一些技巧。下面便是我工作中总结的一套解决方案。小弟才疏，众多不对之处，还请各位高手指教。
修正这个bug首先要洗脑一下，因为错误的认识将不利于你对解决方法的理解。

虽然，那个虚拟的示例网页在IE6中能够“完美的”显示，但是它并不是正确的。我们不能通过css hack的方法让它在FireFox和IE7中显示“靠近”IE6，而是应该“拔下”IE6的那层虚假的“皮”，重新塑造网页，从而让它在IE6、IE7和FireFox中都能正常显示。 就算让网页在IE6、IE7和FireFox中，都可以正常显示了，但却未必就是最终想要的效果。 为了达到最终想要的结果，可能需要使用不推荐使用的措施——css hack。