问题标签 [haslayout]

我正在处理一个具有嵌套 p、div 和 li 的 ol 的页面。Internet Explorer 6 和 7 都在末尾的 p 元素之后（在 li 标记的最底部）呈现 ol 标记的数字，而不是像预期的那样在最外层 li 的顶部。我正在使用 PowerPC Mac，无法进行任何测试。是否有一些简单的 CSS hack 可以使此渲染与 Firefox 中的渲染相同？

您可以在此处查看实时页面。我知道，我正在定位侧边栏。暂时忽略它。

标记如下：

和CSS：

像许多为 Internet Explorer 开发网站的开发人员一样，我似乎遇到了很多由臭名昭著的hasLayout标志引起的错误。

我了解这个标志的作用以及它是如何工作的（大部分情况下）。我前几天读到的一个很好的解释（虽然我找不到源代码）是hasLayout在 IE 中基本上意味着“使这个元素成为一个矩形”。

它显然比这更复杂，但总结得很好（在我看来）。

我不明白为什么浏览器使用这个标志。在寻找答案时，我发现了一个听起来合乎逻辑的答案：

在 CSS 真正全面展开之前，Internet Explorer 不得不处理非常古老的遗留代码。作为使浏览器易于添加 CSS 的架构决策，该hasLayout标志用于触发某些 CSS 属性，以便正确呈现页面。这可以追溯到大约 IE4 的时代。

这对我来说几乎是有道理的，直到我意识到 Firefox（当时的 Netscape）必须处理同样的问题。hasLayoutNetscape 几乎与 Internet Explorer 一样长，但据我所知，它不需要任何内部标志或类似的东西。

既然hasLayout标志是 Internet Explorer 中如此多错误的根源，有谁知道为什么 IE 有这个标志而其他浏览器不需要它？

如果有人有任何理论或碰巧知道答案，我纯粹出于好奇而想知道这一点。我想更多地了解为什么（或为什么不）这个标志是有用的。

我不得不将 hasLayout 应用到 <i> 元素以避免 IE7 错误，其中斜体的句子会掩盖这些句子在同一水平线上的图像。

我已经使用该zoom属性或该display: inline-block属性这样做了。

但是现在，斜体中的任何短语都会导致斜体部分表现得好像它是它自己的块......有点......或者，它只是不会像普通句子那样中断或换行，仅在 IE7 中。IE8和FF正常工作。

示例代码：

像这样渲染：

替代文字 http://img193.imageshack.us/img193/968/haslayoutitalics.png

我怎样才能让我的<i>元素恢复正常功能？

当 hasLayout = -1 是设置为 true 还是 false ......？

谢谢..！

有很多讨论说 IE8 应该修复/删除 hasLayout。似乎没有发生，尽管这通常不是问题。

问题是，当它出现时，似乎没有办法让 IE8 的开发人员工具栏告诉您 hasLayout 正在被应用，就像它过去在 IE7 的开发人员工具栏中所做的那样。

有人有解决方法吗？我错过了一些明显的东西吗？

我有一个包含许多浮动元素的包含元素。该包含元素还应用了一个百分比宽度值。

在 IE7 中，包含浮动元素的元素后面的内容被清除，因为它赋予它 hasLayout 的宽度值（我认为！）。

我不希望包含元素具有布局，但我确实需要它具有明确的宽度。有没有办法在 IE7 中解决这个问题，有效地强制 hasLayout=false。

每当我发现 IE 显示我的网站很奇怪（与 chrome 和 firefox 不同）时，我都会尝试zoom:1在 css 类中添加一个显示奇怪的部分。很多时候，这可以解决问题并使其看起来与其他浏览器一致。

使用有问题zoom:1吗？我知道我的 CSS 不会验证，但是如果我过分依赖使用，是否会出现任何现实世界的问题zoom:1？

我的网站在 IE 6+ 中运行良好，但在 IE 6 或 IE 5.5 中看起来很奇怪，因为我不能忽略使用 IE6 的用户，因为仍然有大约 6% 的流量来自这个版本。我期待着有替补。

通过我的一些研究，我了解到通过设置 haslayout 属性，我可以解决格式问题，但我认为自己的 CSS 非常差，因此我需要你的帮助来纠正这个问题。

您可以在下面找到 URL，您可以在 IE6 中看到它的行为，以防万一您无法测试可以通过查看源代码进行检查，请分享您的建议。

网址：http ://anujtripathi.net/BlogListing.aspx?Id=2

我<a>的页面上有两个不同上下文中的元素，有些在 div 中（称它们为 .container > a），有些在子 div 中（如 .container > .section > a），甚至有些在进一步的后代 div 中（如.container > ... > .section > a)。我目前正在<a>使用以下 CSS 对内联元素进行一些格式化：

由于我目前正在使用 a 对链接进行样式设置border-bottom: 1px dotted #333，因此链接必须保持内联元素。问题是有时 .section 中的链接与 .container 中的链接行为不同。后者在 FF 3.6 和 IE7 中看起来都很好。前者在 IE7 中截断了第一个字符左右（无论在负边距的量内）（我假设为负边距）。

我认为可能是hasLayout的一个bug，所以我检查了三个案例的状态。它们如下：

案例 1) 对于 .container > a，.container hasLayout 为真。( http://imgur.com/WJ3zM.png )
案例 2) 对于 .container > .section > a，.section hasLayout 为 false，.container hasLayout 为 true。( http://imgur.com/4NHxj.png )
案例 3) 对于 .container > ... > .section > a，.section hasLayout 是假的，除了一个中间容器（divs、li 和 ul） hasLayout 为真，.container hasLayout 为真。( http://imgur.com/WefBk.png )

前两种情况在 IE7 中看起来很好，第三种情况有负边距错误。什么可能导致这种情况发生，在这样一个有限的背景下？

我见过许多开发人员在我会使用 100% 的地方编写 99.9% 的 HTML 或 CSS 内联样式宽度。使用 99.9% 有什么正当理由吗？它与100％有任何有效差异吗？

编辑转推 MSalters 的非常好的问题：Considering that 99.9% is one pixel off above 500 pixels, why not 99.99%? 我猜他是对的，如果你要使用，dirty hack你应该使用 99.99%，有人不同意吗？

其他参考：

• @Michael Stum 关于 CSS 缩放属性的评论让我看到了这个关于触发 hasLayout 的有趣链接zoom：http ://www.bennadel.com/blog/1354-The-Power-Of-ZOOM-Fixing-CSS-Issues-In-互联网资源管理器.htm。
• @Andrew Dunn 在 hasLayout 上提供了这个非常全面的链接：http: //www.satzansatz.de/cssd/onhavelayout.html