2012-09-15 48 views
3

新來引導,下面這個問題幾乎一模一樣,似乎無法讓我的藥丸/標籤中心?中心丸在引導

</head> <body> 
    <div class="container"> 
     <ul class="nav nav-pills"> 
     <li><a href="#home" data-toggle="tab">Home</a></li> 
     <li><a href="#profile" data-toggle="tab">Profile</a></li> 
     <li><a href="#messages" data-toggle="tab">Messages</a></li> 
     <li><a href="#settings" data-toggle="tab">Settings</a></li> 
     </ul> 
    </div> 
<html> 

.nav-tabs > li, .nav-pills > li { 
    float:none; 
    display:inline-block; 
    *display:inline; /* ie7 fix */ 
    zoom:1; /* hasLayout ie7 trigger */ 
} 

.nav-pills { 
    text-align:center; 
} 

我有一個名爲style.css的文件中的CSS,和我導入這樣

<link href="style.css" rel="stylesheet" type = "text/css"> 

這兩個文件是引導文件夾內,所以不是真的肯定發生了什麼事

+0

http://jsbin.com/axizic/1對我來說還行。你確定你沒有其他風格與它衝突嗎? – sachleen

+0

噢拍攝,將其用'<鏈路的rel = 「樣式表的」 href = 「CSS/bootstrap.css」>',是什麼,和'<鏈路HREF = 「CSS/bootstrap.css」 的rel =」之間的差相互衝突stylesheet「type =」text/css「>'?第一個問題解決了問題,第二個問題不管用? – zhuyxn

+0

都應該工作。包含樣式的順序很重要。的 – sachleen

回答

4

你需要重寫通過引導定義的.nav藥丸CSS類(因爲你是alread你在做什麼)。您應該更新邊距並指定元素的寬度。

.nav-pills { 
    margin: 0 auto; 
    padding: 0; 
    width: 400px; 
} 
+0

如果你不希望使用屬性,這種方式更優雅, http://stackoverflow.com/questions/9421966/how-do-i-center-the-twitter-bootstrap-tabs-on-the-page –