我有一个绝对定位的" div"，其中包含几个孩子，其中一个是相对定位的" div"。当我在子div上使用基于百分比的宽度时，在InternetExplorer7上它折叠为''0''宽度，但在Firefox或者Safari上却没有。

如果我使用像素宽度，则可以。如果父母位置相对，则孩子的百分比宽度会起作用。

我在这里想念什么吗？除了孩子的基于像素的宽度之外，还有其他简单的解决方法吗？ CSS规范中是否有涵盖此方面的内容？

解决方案：

父级" div"需要具有定义的"宽度"，以像素或者百分比为单位。在InternetExplorer7中，父" div"需要定义的"宽度"，以使子百分数" div"正常工作。

这是一些示例代码。我认为这就是我们要寻找的。在Firefox 3(mac)和IE7中，以下显示完全相同。

#absdiv {
  position: absolute; 
  left: 100px; 
  top: 100px; 
  width: 80%; 
  height: 60%; 
  background: #999;
}

#pctchild {
  width: 60%; 
  height: 40%; 
  background: #CCC;
}

#reldiv {
  position: relative;
  left: 20px;
  top: 20px;
  height: 25px;
  width: 40%;
  background: red;
}

<div id="absdiv">
    <div id="reldiv"></div>
    <div id="pctchild"></div>
</div>

IE 8之前的版本在其框模型方面具有时间方面的特点，最明显的问题是基于百分比的宽度出现了问题。在情况下，默认情况下，绝对定位的div没有宽度。它的宽度将根据其内容的像素宽度进行计算，并在呈现内容之后进行计算。因此，在IE遇到并渲染相对定位的`div''时，其父级的宽度为0，因此为什么它本身会崩溃为0。

如果我们想对此进行更深入的讨论以及许多可行的示例，请在此处进行咨询。

Why doesn’t the percentage width child
  in absolutely positioned parent work
  in IE7?

因为它是Internet Exploder

Is there something I'm missing here?

就是说，要提高同事/客户对IE糟糕的认识。

Is there an easy fix besides the pixel-based width on the child?

使用em单位，因为它们在创建液体布局时更有用，因为我们可以将它们用于填充和边距以及字体大小。因此，如果调整其大小，则空白区域将与文本成比例地增长和缩小(这确实是我们所需要的)。我不认为百分比可以比ems更好地控制；我们可以使用百分之百的ems(0.01 em)进行指定，浏览器将按照自己认为合适的方式进行解释。

Is there an area of the CSS specification that covers this?

没有，据我记得，在CSS 1.0中，em和％''s仅用于字体大小。

我认为这与在较旧的浏览器中实现" hasLayout"属性的方式有关。

我们是否在IE8中尝试过代码以查看是否也可以在其中工作？
IE8具有调试器(F12)，也可以在IE7模式下运行。