не центр Bootstrap панели навигации

Question

Могу ли я пытаться центрировать это: http://jsfiddle.net/MikeStardust/hwhS5/ панель навигации, но не повезло ...

По центру я имею в виду элементы выровненных в одной строке в центре навигации ... искал несколько решений, но ни один из них не работал, в результате была выровнена по центру панель навигации с одним элементом на строку.

Bar HTML (CSS & HTML на jsfiddle)

<div class="navbar navbar-default"> 
    <div class="navbar-header"> 
     <button type="button" class="navbar-toggle" 
       data-toggle="collapse" data-target=".navbar-responsive-collapse"> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     </button> 
    </div> 
    <div class="navbar-collapse collapse navbar-responsive-collapse"> 
     <ul class="nav navbar-nav"> 
     <li><a href="index.html">Home</a></li> 
     <li><a href="http://chaoticunited.com/forums">Forums</a></li> 
     <li><a href="servers.html">Servers</a></li> 
     <li><a href="help.html">Help Center</a></li> 
     <li><a href="#" data-toggle="modal" data-target="#vote">Vote</a></li> 
     <li><a href="#">Donate</a></li> 
     </ul> 
    </div><!-- /.nav-collapse --> 
    </div><!-- /.navbar 

У меня есть это:

И хотел бы, чтобы это: (Результат от фотошопе)

Answer 1

Try изменяя отображаемое значение .navbar-nav на встроенный блок и затем применяя text-align к его родительскому элементу для управления выравниванием.

Если вам нужно изменить выравнивание мобильного вида, вы можете повторно применить text-align в этой точке останова.

.navbar-nav { 
    display: inline-block; 
} 

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

Пример: http://jsfiddle.net/hwhS5/2/