如何将此导航栏居中?

时间:2013-07-04 12:18:04

标签: css center navbar

尝试过很多不同的事情,并且仍然以此导航栏为中心遇到很多麻烦: http://www.miriammedical.co.uk/miriam2012

如果我按照这里的建议...... Editing Nav Menu - How Do I Wrap display:block, float:left to have a Centered Menu? ...这是添加一个固定的并使用保证金0自动,所有发生的事情都是列表偏离中心。

然后是这个,这表明使用margin-left:auto和margin-right:auto ... CSS Issue Centering NavBar ......但同样的事情,它偏离中心

还有其他教程建议使用float:left,但是每当我添加浮动(列表本身,或列表及其容器)时,我要么将列表显示在屏幕的左侧,要么我只需将容器中出现的所有拆分间隙放在一行,而不是将列表放在一行上。

我知道这是一个经常被覆盖的主题,但同样的旧建议对我不起作用。我显然缺少一些东西,所以请帮助。希望有一些启发可以澄清核心编码问题,而不是网上的所有其他答案,这似乎只是提出了相同的基本建议。感谢。

2 个答案:

答案 0 :(得分:0)

这不是一个终极解决方案,但在特定情况下它可以运作

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

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

答案 1 :(得分:0)

你可以用这个:

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