css - jQueryUI slider : absolutely positioned element & parent container height

Question

我在 http://jsfiddle.net/SsYwH/ 上有一个例子

万一它不起作用

HTML:

<div class="container">
   <div class="absolute">
       Testing absolute<br />
       Even more testing absolute<br />
   </div>
   A little test<br />
</div>

CSS:

.container {
    background: green;
}
.absolute {
    position: absolute;
    background: red;
}

问题

我使用 jQuery 来创建 slider 效果。为此，我需要设置绝对位置。

• 我代码中的红色 block 是位置绝对 slider 。
• 绿色 block 是容器。

我仍然希望根据 child 的高度来设置容器。现在它不知道，因为位置是绝对的。解决方案？

Answer 1

绝对定位的元素在流量和大小方面不计入容器的内容。一旦你绝对定位了某个东西，就容器而言，它就好像不存在一样，所以容器无法通过 CSS 从 child 那里“获取信息”。

如果您必须在没有 Javascript 的情况下允许您的滚动条具有由其子元素确定的高度，您唯一的选择可能是使用相对定位。