我如何使这个导航栏居中？答案

【问题标题】：How do I center this navbar?我如何使这个导航栏居中？
【发布时间】：2013-07-02 10:48:37
【问题描述】：

尝试了很多不同的方法，但仍然无法将这个导航栏居中： http://www.miriammedical.co.uk/miriam2012

如果我按照这里的建议... Editing Nav Menu - How Do I Wrap display:block, float:left to have a Centered Menu? ...这是添加一个fixed with并使用margin 0 auto，所发生的只是列表出现偏离中心。

然后就是这个，它建议使用 margin-left: auto 和 margin-right: auto... CSS Issue Centering NavBar ...但同样的，它是偏离中心的

还有其他教程建议使用 float:left，但任何时候我添加浮动（到列表本身或列表及其容器），我要么让列表出现在屏幕的最左侧，要么我只需让所有拆分间隙都出现在容器中，而不是列表在一行上。

我知道这是一个经常被提及的话题，但同样的旧建议对我不起作用。我显然遗漏了一些东西，因此将不胜感激。希望有一些说明可以澄清核心编码问题，而不是网络上的所有其他答案，这些答案似乎只是提出了相同的基本建议。谢谢。

【问题讨论】：

给我们一些代码，我们将向您展示它可以通过 text-align 或 margin:auto 取决于显示轻松实现。（使用 jsfiddle.net 或 codepen.io/pen ）

【解决方案1】：

这不是最终解决方案，但在特定情况下它可以工作

ul#nav {
font-size: 12px;
width: 666px;
margin: auto;
alignment-baseline: central;
}

具有任何 width 和 margin:auto; 的元素将获得相对于其父级的居中位置

【讨论】：

【解决方案2】：

你可以用这个：

div.navbar_wrapper { text-align: center; }
ul#nav { display: inline-block; width:auto; }

【讨论】：