Html 使用绝对定位子div时如何展开绝对定位包装div？

我在网站上搜索了这个问题的答案，从我看到的情况来看，其他问题不涉及家长

div

使用

位置：绝对

这是我的密码：

<div id="wrapper">

    <div id="child">
    Here are the contents to be displayed.
    </div>

</div>

这里有一把小提琴：
现在给

    #wrapper{
position:relative;
position:absolute; // remove this line
}
    .child{
    position:absolute;
    left:0;
    right:0;
    width:500px; // remove this line
    }

始终给予父div
相对位置
和子div给予
绝对位置

更多
如果父母不能是相对的，那么孩子必须是相对的（你将获得相同的行为）。如果两者都是绝对的，那么它们就没有关系，因此父母不能适应孩子（反之亦然）。您还必须将填充底部添加到父级，以修补子级的完整大小（至少是子级的顶部+您想要的任何填充）

更新的fiddle with示例：

我在小提琴上试过，但没什么区别？另外，为什么我需要删除子项的
宽度
？该解决方案依赖于
最小高度
，因为子项内容是可变的，所以该解决方案不起作用。谢谢，这是到目前为止我读到的最简单的解释。
    #wrapper{
position:relative;
position:absolute; // remove this line
}
    .child{
    position:absolute;
    left:0;
    right:0;
    width:500px; // remove this line
    }

#wrapper {
    ....
    padding-bottom: 60px; /* 35px from childs top + 25px for padding */
}
#child {
    ....
    position:relative;
}