用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中心我的导航栏

回答

相关问题