html - 无法使用 html 和 css 将我的菜单居中

Question

您好，我无法将此菜单居中。我尝试过更改边距并使用中心标签和使用 div 但没有成功。任何帮助将不胜感激。谢谢!

这是 JSFiddle:http://jsfiddle.net/G8gE2/

这是CSS:

ul# nave {
    margin - left: auto;
    margin - right;
    auto;
}
ul.drop a {
    display: block;
    color: #fff;
    font - family: arial;
    font - size: 18px;
    text - decoration: none;
}
ul.drop, ul.drop li, ul.drop ul {
    list - style: none;
    margin: ;
    padding: 0;
    border: 1px solid# fff;
    background: #009933; color:       # fff;
}
ul.drop {
    position: relative;
    z - index: 597;
    float: left;
}
ul.drop li {
    float: left;
    line - height: 1.3em;
    vertical - align: middle;
    zoom: 1;
    padding: 5px 10px;
}
ul.drop li.hover, ul.drop li: hover {
    position: relative;
    z - index: 599;
    cursor: default;
    background: #1e7c9a; }
     ul.drop ul{visibility:hidden; position: absolute; top:100%; left:  0;z-    index:598; width:195px; background:# 009933;
    border: 1px solid# fff;
}
ul.drop ul li {
    float: none;
}
ul.drop ul ul {
    top: -2px;
    left: 100 % ;
}
ul.drop li: hover > ul {
    visibility: visible
}

Answer 1

要在中间对齐 div，您需要为 ul 指定宽度。那就是

ul#nave
{
    width:500px;
}

并从 CSS ul.drop 中移除 float:left