html - 清除：都带有 h2 标签：h2 边距不起作用

Question

我有float: leftdiv，我想在它之后清除浮动。<div style="clear:both;"></div>如果我在浮动 div 之后插入，那么它工作正常。问题是我需要一个没有额外的解决方案div。

我添加clear:both了h2标签，它可以工作，但没有考虑 h2 上边距。

HTML：

<p class="with_arrow_down">IF you don’t know the cost you are&nbsp;probably making the wrong decisions</p>
<!--<div style="clear:both;"></div>-->

<h2 class="bigmargin">Check list for maintaining the highest levels </h2>

CSS：

.with_arrow_down {        
    padding-top: 44px;
    height: 30px;
    width: 28%;
    text-align: center;
    margin-left: 5%;
    float: left;
}
.with_arrow_down:nth-of-type + * {
    clear: both;
}
h2.bigmargin {
    margin: 65px 0 65px 0;
    clear:both;
}

请解释一下如何使 h2 边距起作用。

JSFIddle：http: //jsfiddle.net/smdgg/3/

Answer 1

它确实有效。

您的 JS Fiddle 演示缺少clear: both问题中的 h2 规则。

如果我们更新它，那么唯一的问题是它与之前的内容重叠，因为该元素具有固定的高度，因此内容会溢出，这可以通过设置 overflow hidden来证明。