Css 拉伸div以适合绝对定位的内容

有没有办法只使用css而不使用脚本？我有一个最小宽度的div，里面是一个绝对定位的内部div，动态生成的内容宽度可变。有时内容超出了包含的div，但由于其绝对位置，它不会拉伸包含的div。如何让它拉伸包含的div？谢谢

尝试引用我制作的JSFIDLE。 如果我读对了，那基本上就是你要找的

HTML

---

如果内容元素具有

位置：绝对

，则不可能。但是，有时您可以避免绝对定位，但也可以通过使用浮动元素来获得所需的结果。有关示例，请参见至。

设置一个示例，以便我们可以处理您所拥有的内容，绝对定位的div不再“在”父级中。因此，仅使用css是不可能做到这一点的。这对于保持子对象的宽度非常有效，但是有没有办法使父对象的高度也包含子对象？如果绝对

div

中没有填充太多文本，则不起作用。此示例仅在有大量内容要填充位于

div

的ABOSULT时有效。

<div class="container" >
<div class="relative" >
    <div class="absolute" >

        <h1>I am Content i can be as long as you wish. t is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English. Many desktop publishing packages and web page editors now use Lorem Ipsum as their default model text, and a search for 'lorem ipsum' will uncover many web sites still in their infancy. Various versions have evolved over the years, sometimes by accident, sometimes on purpose (injected humour and the like).</h1>

    </div>
</div>

.container{
    width: 500px;            
}

.relative{
    position: relative;
    background: #666;
    min-width: 200px;
    min-height: 200px;
}

.absolute{
    position: absolute;
    background: #999;
    top: 20px;  /* not important, just to show absolute position */
    left: 20px; /* not important, just to show absolute position */ 
}