CSS HasLayout IE7 错误答案

【问题标题】：CSS HasLayout IE7 BugCSS HasLayout IE7 错误
【发布时间】：2011-07-03 01:42:33
【问题描述】：

首先，我阅读了以下文章，只是为了复习这些问题，并且我之前已经处理过它们：

Position Relative / Absolute / Fixed in IE

http://www.brunildo.org/test/IE_raf3.html

http://www.satzansatz.de/cssd/onhavinglayout.html

对于一些有这些问题的人可能是新人，以上内容会有所帮助，但就我而言，我在所有非 IE 浏览器中都有以下内容：

http://cl.ly/4n6F[图片]

以及IE7中的以下内容

http://cl.ly/4nYm[图片]

我知道我需要在大棕色<div id="footer"> 上触发hasLayout = true，因为它是在IE7 中触发hasLayout = false 的position: relative。我试过zoom: 1 和display: inline-block 尝试在#footer 上触发hasLayout，但没有成功。

这里是现场直播的网站，供您观赏： http://hannahnour.co

div消失的原因是#footer上的hasLayout当前是false。

如何触发？！

【问题讨论】：

设置一个测试页面真的可以帮助你快速得到答案。
不用测试，看上面的现场直播，我已经加了链接

标签： css debugging internet-explorer

【解决方案1】：

@sweetroll 是正确的，这与hasLayout 无关。

问题出在/wp/wp-content/themes/custom_bellydance_theme/style.css内部。

您有两行（特别是行354 和438），其中包含filter 规则：

filter:  progid:DXImageTransform.Microsoft.Matrix(sizingMethod='auto expand', /* IE6,IE7 */ 
                      M11=0.9986295347545738, M12=0.05233595624294383, M21=-0.05233595624294383, M22=0.9986295347545738);

看起来，任何一行之后的任何 CSS 都不会被 IE7 解析。

如果您删除这两行，您的网站将在 IE7 中修复。

我不确定这些行的实际问题是什么。我尝试删除这些行内的/* */ cmets，但这没有任何区别。

我建议最好的方法就是忘记将旋转日期悬停在 IE6/7 上。它不是那么重要的一个效果，它只是在两个不重要的浏览器中。如果这是不可接受的，您可以提出另一个问题，看看是否有其他人知道此问题的原因（如果您知道，请确保您链接到此问题）。

很高兴您决定链接到您的网站。

否则，任何人都不可能弄清楚这一点。

【讨论】：

确实很高兴我发布了一个链接...非常感谢你和@sweetroll。你说得对，调试起来非常困难。向你致敬！
没问题。我从中学到了一些新东西：我以前从未遇到过filter 规则破坏 IE7 的情况。
哇，我花了好几个小时试图找出一个类似的错误，IE7 奇怪地定位一个 div（然后在我点击它时移动 div），它似乎与“过滤器”有关" 我的 CSS 行。谢谢。
糟糕，这实际上并没有解决它。 stackoverflow.com/a/1794381/470749 做到了。无论如何感谢您的帖子！

【解决方案2】：

这不是 hasLayout 问题。您需要验证您的标记。看起来你正在自我关闭一个标签，然后再次添加一个关闭标签，这使得 IE 出现错误。你还有一个额外的结束 div 标签，它会定义你的布局。

Firefox 和 Chrome 等浏览器足够聪明，可以正确呈现问题，但拥有有效代码仍然是个好主意。

希望这会有所帮助！

【讨论】：

感谢您的帮助，上面的@thirtydot 能够解决这个问题，尽管我也解决了这些嵌套问题，谢谢！