绝对定位的子div扩展到适合父母？

Question

无论如何,绝对定位的孩子是否可以扩展以填补其相对定位的父母？(父级的高度不固定)这是我所做的,它与Firefox和IE7正常工作,但不是IE6.:(

<div id="parent">
    <div id="child1"></div>
</div>

#parent { position: relative; width: 200px; height:100%; background:red }
#child1 { position: absolute; top: 0; left: 200px; height: 100%; background:blue }

Answer 1

这很简单.诀窍是设置top: 0px并bottom: 0px在同一时间

这是工作代码

html, body {
    width: 100%; 
    height: 100%; 
    overflow: hidden;
}

#parent { 
    display: block;
    background-color: #ff0;
    border: 1px solid #f00;
    position: relative; 
    width: 200px; 
    height: 100%;
}
#child1 { 
    background-color: #f00; 
    display: block;
    border: 1px solid #ff0; 
    position: absolute; 
    left: 200px;
    top: 0px; 
    bottom: 0px;
}

在这里查看一个工作示例 http://jsfiddle.net/Qexhh/

Answer 2

如果我没记错的话，IE6 处理 div 高度的方式有一个错误。当高度设置为 100% 时，它只会将 div 创建到包含其中内容所需的高度。我会推荐两种方法：

1. 不用担心是否支持 IE6，因为无论如何它都是一个死浏览器
2. 如果这不起作用，请使用 jQuery 之类的东西来获取父 div 的高度，然后将子 div 设置为该高度。
3. 通过将背景设置为相同颜色来伪造它，这样就没有人注意到差异