Css Twitter引导-响应两行时将导航栏居中

我有一个导航栏，上面有很多下拉菜单。当导航栏位于一行（全尺寸屏幕）上时，我将其居中。当屏幕很小时，我成功地将其折叠成一个按钮，该按钮居中。但是，当屏幕大小为中等且导航栏位于两行时，两行都不居中。我该如何解决这个问题

以下是JSFIDLE：

您可以调整JSFIDLE右下角框架的大小，以查看我上面提到的不同屏幕大小的结果

HTML:

---

若你们想让菜单居中，避免使用浮动。检查是否有帮助

@media (min-width: 768px) {
    .navbar-nav>li {
    float: none;
    display: inline-block;
    }
}

---

这确实给出了期望的结果。你能解释一下为什么

只适用于一行，而个人

只适用于多行吗？我没有完全理解你的要求。我所做的是，我删除了768宽度以下所有第一个li的浮动（使用“>”）。我在

导航栏导航上有相同的
浮动
和
显示
代码，但这只对一行居中。而您的
.navbar nav>li
代码仅对多行居中（我删除了
min:width
进行测试）。我只是想知道为什么。你集中了整个ul，但没有集中在内部li。似乎一行居中，但它没有居中，它占据了ul的全部空间，并落到了下一行。移除li的浮动并给出显示内联块使其居中。
.navbar-nav {
  /*center navbar inner elements*/    
  display: inline-block;
  float: none;
}

.navbar-toggle 
{
  /*center collapse button*/
  float:none;
}

@media (min-width: 768px) {
    .navbar-nav>li {
    float: none;
    display: inline-block;
    }
}