html - 如何在html5中浮动部分标签

Question

这可能是一个简单的问题，那么，如何浮动 - 离开<section>标签？我尝试使用float: left;但不起作用，或者是否可以将标签与其内容垂直对齐？

这是我的尝试。

html。

<div id="divcontent">
    <section>
        <h1>heyo</h1>
        <a href="dropitinmyass.html" ><p>asdasdasdasd</p></a>
    </section>
    <section>
        <h1>heyo</h1>
        <a href="dropitinmyass.html" ><p>asdasdasdasd</p></a>
    </section>
    <section>
        <h1>heyo</h1>
        <a href="dropitinmyass.html" ><p>asdasdasdasd</p></a>
    </section>
</div>

这是CSS。

#divcontent {overflow: auto; padding: 15px;}
#divcontent section {float:left; width: 300px;}

Answer 1

默认情况下，所有HTML5新元素inline。您必须display:block为所有这些指定，它们应该显示为divs。

#divcontent {overflow: auto; padding: 15px;}
#divcontent section {display: block; float: left; width: 300px;}

Answer 2

你可以把它float <section>当作<div> 最好的，你也可以给它一个width，这样花车就可以工作了。

section {
  float: left;
  width: 200px;
  display: block; /* for old browsers */
}