html - 空DIV高度IE7

Question

更新 1:

我发现当从 div 中删除 width:100% 时，我得到了我想要的结果，如果它不包含任何内容，它的高度为 0。但是，我需要 div 的宽度为 100%，这出于某种原因迫使它具有没有内容的高度。

这是问题的一个 jsfiddle。只有在使用 IE7(可能是 IE6 及更低版本)访问以下链接时，您才会看到问题。

http://jsfiddle.net/RQeeg/2/

原始问题:

我有一个空的 div，由于某种原因它有一个高度。

在 Chrome 上，div 根本不会出现，除非它包含内容。另一方面，即使没有内容，IE7 也会显示 div。

所以基本上，如果它是空的，我希望它的高度为 0px，如果它有内容，则自动调整它的高度。如果它的宽度不是 100%，这正是它的行为方式。

Answer 1

在得知您正在使用 position: fixed 后更新:

这里要支持IE7，必须使用两个div秒。我有理由相信没有办法解决这个问题(除非您更愿意坚持使用一个 div 并使用 JavaScript 修复)。

参见:
没有内容:http://jsfiddle.net/r3P8D/2/
含内容:http://jsfiddle.net/r3P8D/3/

出现此错误的原因是一旦您添加了某些属性，例如 width: <not auto>或 position: fixed ，你触发 hasLayout on the element .一旦触发 hasLayout ，这个错误发生了。

因为你需要 position: fixed ( ..which doesn't even work in IE6 ，但我离题了)，没有办法避免 hasLayout ，因此无法避免此错误。

因此，我已经为您提供了我能想到的最佳解决方法。

---

旧答案:

However, I need the div to have a width of 100%

根本不要使用width: 100% .

div然后将具有默认值 width值，即 auto ，因此它将采用“完整的可用宽度”。 width: auto与 width: 100% 不一样 , 但出于这个问题的目的，它在视觉上看起来是一样的。

在 Chrome 和 IE6/7 中检查这个(无内容):http://jsfiddle.net/r3P8D/
在 Chrome 和 IE6/7 中检查这个(有内容):http://jsfiddle.net/r3P8D/1/

根据我对您问题的理解，这正是您所要求的。