用CSS中心我的導航欄

由於幾天我正在爲我的網站導航欄工作。但我想集中它。這裏是我的CSS用CSS中心我的導航欄

.nav{ 
    float:right;width:980px 
} 
.nav ul { 
    width: 980px; 
    margin: 0 auto; 
    padding: 0; 
    list-style: none; 
    font-size: 1.5em; 
    font-weight: 300; 
} 
.nav li { 
    float: right; 
    width: 87px; 
    text-align: center; 
    -webkit-transition: border .5s; 
    -moz-transition: border .5s; 
    -o-transition: border .5s; 
    -ms-transition: border .5s; 
    transition: border .5s; 
} 
.nav a { 
    display: block; 
    width:87px;height: 74px; 
} 
.no-touch .nav a:hover , 
.nav a:active , 
.nav a:focus { 
    height: 84px; 
} 
.nav li span { 
    display: block; 
    font-family:"Droid Arabic Kufi";

來源

2014-04-30 user3590814

你可以添加一些HTML，並把它扔在[小提琴]（http://jsfiddle.net）？ –

設置navbars顯示屏阻止.. –

上的導航浮標是不必要的和用的.nav防止.nav ul到中心。

.nav { 
    float: right; // Remove this. 
    width: 100%; // Change this. 
}

http://jsfiddle.net/7TBHn/2/

雖然在我的jsfiddle我使用nav元素是更多的語義，但其他然後，它沒有什麼區別。

來源

2014-04-30 20:55:32 sidneydobber

把這個在您的.nav ul：

margin-left:auto; 
margin-right:auto;

這應該居中。希望這可以幫助！

來源

2014-04-30 21:44:33 Brendan

用CSS中心我的導航欄

回答

相關問題