如何使每个孩子添加到元素的高度增加

Question

我有一个<div>，脚本附加了子代。这些子元素由PHP脚本自动附加，并使用position:absolute定位。我尝试向父<div>提供样式min-height:400px，允许附加到<div>的元素增加父级的高度。唯一的问题是，当我这样做时，高度不会增加。有人知道我能做些什么来解决这个问题吗？

编辑：我无法使用position:relative来定位我的元素。是否有任何允许position:absolute的解决方案。

Answer 1

是的你可以使用绝对位置（yeee♥！）

的 LIVE DEMO TEST CASE

简单地做：

$(this).height( this.scrollHeight );

或使用纯JS：

this.style.height = this.scrollHeight ;

并将其添加到元素的CSS中：

overflow:hidden;
overflow-y:auto;

修改

demo在IE10，Firefox，Chrome，Safari和Opera中测得很好。

这里的关键点是将x或y轴的溢出值（需要大小的尺寸）设置为auto，而不是默认值visible。然后可以在HTML DOM对象上使用scrollWidth或scrollHeight属性来获取元素的完整大小，包括任何绝对定位的后代。

看起来很奇怪，这与为容器设置overflow:hidden剪辑任何绝对定位的后代的事实完全一致。显然，position:absolute的元素并不像我们一直被告知的那样“脱离流动”：）

Answer 2

你不应该使用position: absolute，因为那样定位的东西会被拉出正常的渲染流程。这导致父母没有注意到其内容非常高。使用position: relative作为子div。这样父母就会自动成长。