ブートストラップナビバーの位置を変更する

Question

こんにちは私は、誰かがブートストラップナビバーをどのようにセンタリングするか知っていますか？

HTML

<nav class="navbar navbar-default"> 
      <div class="container-fluid"> 
       <ul class="nav navbar-nav"> 
        <li class="active"><a href="#">Home</a></li> 
        <li><a href="#">History</a></li> 
        <li><a href="#">Information</a></li> 
        <li><a href="#">Geographical location</a></li> 
       </ul> 
      </div> 
     </div> 
    </nav> 

、それはより良いAが未使用のスペースがたくさんあるが、その左側に接着し、私はそれを中央に大好きだ持っていない収まるので、私は、ナビゲーションバーの幅を変更しました。

CSS

.navbar-default { 

width:38.5%;} 

Answer 1

これを試してみてください。これが必要です

.navbar-default { 
margin-left:auto; 
margin-right:auto; 
width:38.5%;} 

Answer 2

ここに行きます。

@media (min-width: 768px){ 
 
    .navbar-nav{ 
 
     float:none; 
 
     margin: 0 auto; 
 
     display: table; 
 
     table-layout: fixed; 
 
    } 
 
}

<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
 
    <nav class="navbar navbar-default"> 
 
      <div class="container-fluid"> 
 
       <ul class="nav navbar-nav"> 
 
        <li class="active"><a href="#">Home</a></li> 
 
        <li><a href="#">History</a></li> 
 
        <li><a href="#">Information</a></li> 
 
        <li><a href="#">Geographical location</a></li> 
 
       </ul> 
 
      </div> 
 
     </div> 
 
    </nav>

またcodepen例：https://codepen.io/Karadjordje/pen/eewpWO