在引導程序中居中置放導航條

我遇到Bootstrap問題，導致我無法在頁面上居中放置導航欄。導航保持偏離中心，因此我的CSS不正確。有沒有人使用Bootstrap來對齊導航欄時遇到類似的問題。在引導程序中居中置放導航條

下面是HTML：

<div class="container-fluid" id="main-section"> 
    <div class="jumbotron" class="col-md-8 col-md-offset-2"> 
     <div class="row"> 
     <div > 
      <h1 id="name-lead">Title</h1> 
      <p class="lead"> 
      Info 
      </p> 
     </div> 
     </div> 
     <div> 
     <ul class="nav navbar-nav"> 
      <li><a href="#">home</a></li> 
      <li><a href="#">link2</a></li> 
      <li><a href="#">link3</a></li> 
      <li><a href="#">link4</a></li> 
     </ul> 
     </div> 
    </div> 
    </div>

這裏是CSS：

.jumbotron { 
    background: none; 
    text-align: center; 
    margin-top: 75px; 
    margin-bottom: 75px; 
} 

.jumbotron .nav ul { 
    display: inline-block; 
} 

.jumbotron .nav ul li { 
    display: inline; 
}

來源

2016-04-20 Wolfgang Hall

只需添加到你的CSS

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

例here

來源

2016-04-20 23:43:14

在引導程序中居中置放導航條

回答

相關問題