CSS高度：100％问题

Question

我正在尝试让div wrapper包围其中的所有div，以便根据内容的数量wrapper的高度增长。

我猜测这样做的方法是设置height: 100%，但正如您从下面的屏幕抓取中看到的那样，情况并非如此。

在哪里说'No :-('是height: 100%正在做的事情，理想情况下我希望wrapper位于底部，表示“是”并且我画了一条红线

非常感谢任何帮助。

Answer 1

如果您正在使用浮动，则让容器溢出：隐藏可能会解决问题。如果没有为div赋予固定大小，则会使其在浮动元素上延伸。

如果你在容器中有绝对定位的元素，那么最好看一下html / css的解决方案。

Answer 2

听起来你需要一个clearfix。

http://css-tricks.com/snippets/css/clear-fix/

您需要定义clearfix类（如上面的链接中所述）将.clearfix添加到#wrapper。

Answer 3

你可以发布一个到css的链接吗？ 我想到的第一件事是包装器中div的position属性。如果它们设置为float或absolute，则它们不会包含在包装器中。这是预期的行为。 这是一篇关于包含浮点数的好文章： http://complexspiral.com/publications/containing-floats/

如果问题很可能，那么你可以对内部div进行相对定位，或者，如果你使用浮点数，你可以在包装器的末尾添加一个不可见的块显示的hr，如下所示：

<div id="wrapper">
            /*All divs to be contained here*/
            <hr style="display:block;clear:left;visibility:hidden;">
</div>

明确：左;是什么摆脱了以前元素的“浮动”。应该根据您的花车改变'左'。 在上面的文章中，这是我最喜欢的方法。