如何设置内容高度来填充？

Question

从此代码：JSFiddle_original

我想将包装器高度设置为lorem ipsum文本高度。

所以我创建了这段代码：JSFiddle_mine 但是包装器高度始终与html高度相同。如何将包装大小设置为文本高度？

.wrapper {
    width:400px;
    position: relative;
    height: 100%;
}

我这样做但现在包装大小与html-body大小相同。

Answer 1

从“.wrapper”中删除相对位置和高度：100％。从“.content”中删除绝对定位。 CSS中似乎有太多不必要的定位技巧。

Answer 2

正如其他人所说，你需要删除.wrapper { height: 100%; }，以便高度取决于其内容。

如果您将.content更改为position: relative，那么它应该有效。绝对定位的元素被从流中取出，因此它们不会影响其父级的大小。

Example