Question

我有点困惑。我喜欢将正常引导导航栏的菜单项居中但我找不到合适的课程，我必须编辑。我应该使用text-align或margin: 0 auto;来实现这样的目标吗？

目前，我尝试在.navbar，.navbar-inner和.nav中添加此CSS参数。什么都行不通。

如果有一些bootstrap开发者，请帮助我！

你知道是否有一个关于bootstrap东西的论坛？

Answer 1

指定固定高度，然后将margin: 0 auto;设置为您必须居中的元素，但请记住，中心div不应为floated或position: absolute;且宽度固定例如

 <div class="parent">
      <div class="inn"> ... </div>
    </div>

要居中.inn应该有固定的宽度，而不是floated or position: absolute，即。

.inn{
  width: 20px;
  margin: 0 auto;}

Answer 2

您可以尝试执行以下操作：

#div-id-inside-navbar{
  left: 50%;
  position: absolute;
  margin-left: -100px /* This should be half the width of your centered content */
}

我在我的引导网站上设置了徽标，这就是我必须要做的。我没有查看确切原因，但我不相信text-align: center;工作得很好。这类似于人们通常使用CSS垂直居中的方式。

Answer 3

要回答您的问题，您应该修改的选择器似乎是.navbar .nav

修改该选择器，您可以继续实施保证金方法：

.navbar .nav {
    margin: 0 auto;
    width: ...px;     /* width of .navbar .nav */
    float: none;
}

或者，与Nick提到的相似：

.navbar .nav {
    position: absolute;
    left: 50%;
    margin-left: ...px; /* half of width of .navbar .nav */
}

我没有深入研究这个问题，但看起来.navbar .nav正在获得与之相关的宽度（对我而言，它是1170px）。由于它的宽度，margin: 0 auto没有影响......很高兴能够提出一个不需要硬编码宽度（或半宽边距）的解决方案。