浮动时div不被包含 -

Question

有谁知道为什么这个.inner div不包含这个浮动的元素？

Here is a jsfiddle

<header>
    <div class="inner">

        <h1>Heading Level 1</h1>

        <h2>Heading Level 2</h2>

        <a href="http://derekthomaswood.com">BUTTON</a>

    </div> <!-- end .inner -->
</header>

Answer 1

将overflow: auto添加到.inner：http://jsfiddle.net/7Sunw/1/

float: left/right以某种方式从标准元素流中获取元素，因此父元素不再延伸到它的大小。即使子元素被浮动，您也必须使用overflow: auto来实现它。

Answer 2

尝试在标题

之后添加另一个div

<div id="footer" style="clear: both;"></div>

应该这样做