在我通过开发人员工具栏进行编辑之前，元素不会出现在IE7中

Question

这个让我难过 - 我的页面上有一个绝对位置的元素，在一个相对位置的容器内。在除IE7之外的所有浏览器中，它出现在正确的位置，完全没有问题。

在IE7中，直到我在开发人员工具栏的“属性”选项卡中添加或编辑其任何CSS属性时才会显示该元素（即使是与其可见性或位置无关的属性，如color）。一旦我这样做，它就会正确显示 - 如果我删除刚刚添加的属性（或撤消修改），甚至仍然可见！

这必须是IE7特定的显示错误，但我无法找到解决方法 - 我已经抛出float，zoom等等无效。< / p>

Answer 1

我通过将消失的元素更深一层地移动到另一个子元素中来修复此问题。由于子元素是浮动的，但没有位置，消失的元素仍然相对于父元素定位，这是我想要的 - 但由于某种原因，这也导致它在IE7中可见，就像它应该是

这就是我导致元素消失的原因（不是真实的ID）：

<div id="parent" style="position: relative;">
  <div id="disappear" style="position: absolute; left: -8px; top: -17px;>This element disappears</div>
</div>

这就是它出现的原因：

<div id="parent" style="position: relative;">
  <div id="child" style="float: left; width: 340px;">
    <div id="disappear" style="position: absolute; left: -8px; top: -17px;">Now this element appears</div>
  </div>
</div>

浮动#parent并给它一个width（#child具有的两个属性）不起作用，但是 - 我必须使用单独的子元素。完全奇怪，但我想发布这个以防万一其他人遇到同样的问题！

Answer 2

IE开发人员工具栏如何触发它可见，这不奇怪吗？！

我修复它而不是使用绝对定位为子元素使用相对定位与负边距 - 左定位元素。不理想，因为它使设计更脆弱，但我当时唯一的选择。