html5 nav中的中心徽标

Question

所以我试图在html5的导航部分中居一个徽标。

  <header>
    <div class="container1">
       <nav>
           <div class="logo">Logo</div>
       </nav>
    </div>
  </header>

http://jsfiddle.net/RbctB/

有什么建议吗？提前谢谢！

Answer 1

删除float: left;并添加margin: 0 auto;

http://jsfiddle.net/RbctB/2/

Answer 2

您无法使用float:left并希望能够将其置于中心位置。

到目前为止，水平居中元素的最简单方法是使其容器使用text-align:center，受影响的元素使用display:inline-block（以及可选text-align:left来覆盖容器的文本对齐方式）

Answer 3

将margin:0 auto;添加到.logo并删除float:left。

此外，您没有正确使用nav元素，因为它应包含当前没有的导航。

Answer 4

<强>首先

删除这一行：

margin-left: auto;
margin-right: auto;

以＃container1 样式。

<强>第二

以 .logo 样式，擦除：

float: left;

并添加：

margin: 0 auto;

我可以建议您删除不用于澄清代码的所有样式吗？

希望这能解决你的问题。

Answer 5

如上所述，这只是另一种说法。

.logo {
    float: left; /*remove */
    margin: 0 auto; /*add */
}