使用 _s 入门主题将 Wordpress header 元素居中时出现问题

Question

如果我在这里遗漏了一些明显的东西，我深表歉意，但我无法将 header 元素居中。

我正在对 #site-navigation 中的 header 中的元素进行样式设置，以便我可以使用 background-color 属性，该属性延伸到 #masthead 中宽度的 100%没有被截断。

为了给你一个想法，我的徽标和链接目前是左对齐的，但我不确定为什么。

这是我的代码：

HTML

<header id="masthead" class="site-header">
    <nav id="site-navigation" class="main-navigation">
        <a href="#"><!-- code for logo svg --></a>
        <span id="list-container"><!-- code for links (primary menu) --></span>
    </nav>
</header>

CSS

#masthead {
  background-color: #efefef;
  height: 100px;
  margin: -100px auto;
  overflow: hidden;
  position: fixed;
  width: 100%;
  z-index: 1000;
}

#site-navigation {
  margin-left: auto;
  margin-right: auto;
  max-width: 1200px;
  width: 95%;
}

Answer 1

在 _s（下划线）Wordpress 入门主题中，class .main-navigation 具有属性 float: left。所以我在 header class 中使用了 float: none 来居中它。

使用 _s 入门主题将 Wordpress header 元素居中时出现问题

Trouble centering Wordpress header elements with _s starter theme

html

css

wordpress

centering

underscores-wp