Question

是否有可能让父（position：relative）自动延长其绝对子宽度？这是我的jsfiddle链接：http://jsfiddle.net/YD2Xu/

理想的是#container，＃full-width应该与＃large-width具有相同的宽度。

CSS：

#container {
    position: relative;
    border: 1px solid green;
}
#large-width, #full-width {
    display: table;
    position: absolute;
}
#large-width {
    white-space: no-wrap;
    width: 1500px;
    height: 200px;
    border: 1px solid red;
}
#full-width {
    top: 30px;
    width: 100%;
    border: 1px solid blue;
}

HTML：

<div id="container">
    <div id="large-width">
        this is large width
    </div>
    <div id="full-width">
        this is full width
    </div>
</div>

我需要通过css实现这一点，不要使用javascript。有谁知道怎么做？

非常感谢你。

Answer 1

如果孩子的位置是绝对的，你不能根据孩子的大小扩展父母的div，因为具有绝对位置的元素会从流程中删除，所以他们的大小和甚至被包括父母在内的其他元素所忽略。您可以使用CSS设置固定大小或使用javascript。

Answer 2

尝试

overflow:auto;

表示父母;

CSS相对div的宽度自动延伸绝对div

2 个答案: