Div扩大到绝对定位的内容的大小

Question

我有一个包含几个绝对定位的div的Div。顶层的可点击区域扩展到儿童区域，但绘制的区域不会。我想绘制的区域围绕所有的容器div。

代码的的jsfiddle在这里 - http://jsfiddle.net/VolatileStorm/C29P8/

经过几次刷新，你可能会注意到在左上角有一个红色的小盒子（用div的隐藏）。这是容器，我希望它包围着孩子们。

任何想法？谢谢。

Answer 1

鉴于你已经有了一个JS选项，我会给你一个使用CSS的。它可能看起来是一个黑客的东西，但它的工作原理：http://jsfiddle.net/C29P8/131/

的想法是删除所有的定位元素，设置“.pile”容器float: left;，扩展它以适应内容（还设置了笔记到float: left;，因为它们没有定位），并使用“.note”中的margin-left: -100px;和padding-left: 110px（“pad”中额外的10px的填充只是允许旋转音符，使其保持在红色边框内）移动音符，这样每张音符就会相互重叠。

我并不擅长解释它，对不起，所以我评论了我在JSFiddle页面上添加和更改的代码，希望这些代码更清晰。

Answer 2

将绝对定位的元素从页面流中取出，因此，您可以使用JS读取子元素的尺寸以设置父元素的尺寸，或者只设置相对div的高度&宽度。

Answer 3

使用getBoundingClientRect()找出需要的实际宽度。

工作演示：http://jsfiddle.net/C29P8/137/。