居中引导导航栏汉堡包答案

【问题标题】：Centering bootstrap navbar hamburger居中引导导航栏汉堡包
【发布时间】：2016-10-20 22:34:23
【问题描述】：

在引导导航栏中将链接居中非常容易（请参阅对类似问题的回复之一中的小提琴，here）。

如何使折叠的“汉堡包”居中，使其也出现在导航栏的中心？

供参考，相关代码如下：

<style>
@media (min-width:768px) { 
  /* centered navigation */
  .nav.navbar-nav {
    float: left;
  }

  .nav.navbar-nav {
    clear: left;
    float: left;
    margin: 0;
    padding: 0;
    position: relative;
    left: 50%;
    text-align: center;
  }

  .nav.navbar-nav > li {
    position: relative;
    right: 50%;
  }

  .nav.navbar-nav li {
    text-align: left
  }
}
</style>

<nav class="navbar navbar-default">
  <div class="container-fluid">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
    </div>
    <div class="collapse navbar-collapse" id="myNavbar">
      <ul class="nav navbar-nav">
        <li><a href="#">About</a></li>
        <li><a href="#">Posts</a></li>
        <li><a href="#">Recipes</a></li>
        <li><a href="#">Press</a></li>
        <li><a href="#">Contact</a></li>
      </ul>
    </div>
  </div>
</nav>

【问题讨论】：

请提供您的问题的相关代码
@AndrewLyndem 代码在我链接到的问题中。否决票有理由吗？这个问题是对网站上另一个问题的跟进。有没有更合适的方式来表达后续问题？
因为您链接的那些问题可以随时删除，因此您的问题对于需要帮助的其他人无效。请阅读此How-To-Ask-In-SO

标签： css twitter-bootstrap

【解决方案1】：

中心“汉堡”也很简单：

.navbar-header{
    text-align:center;
}

.navbar-toggle {
    float: none;
    margin-right:0;
}

【讨论】：