如何将导航水平对齐并居中

Question

我需要将导航链接居中放置在div中，并将其水平对齐。我尝试过这种方法，但没有成功。

修正了#centermenu之前的错误，谢谢，但仍然不起作用。

            <nav id="centermenu">
                   <ul>
                         <li><a href="#">Business</a></li>
                         <li><a href="#">Specialities</a></li>
                         <li><a href="#">Contact us</a></li>
                    </ul> 
            </nav>

CSS：

#centermenu {
float: left;
width: 100%;
border-bottom: 2px solid #011;
background: #ffe;
overflow: hidden;
position: relative;
}
#centermenu ul {
float: left;
clear: left;
position: relative;
list-style: none;
display: block;
text-align: center;
}

 #centermenu ul li {
display: block;
float: left;
list-style: none;
margin: 1em;
padding: 1em;
}

感谢

Answer 1

UL部分似乎存在键入错误。

Cetermenu ul

而是关闭

Centermenu ul

编辑：

以下似乎对我有用。也许一个接一个地添加其他标签，看看它是否坏了。

#centermenu {
float: left;
width: 100%;
    text-align: center;
border-bottom: 2px solid #011;
background: #ffe;
overflow: hidden;
position: relative;
}
#centermenu ul {
margin: 2 auto;
display: block
}

#centermenu ul li {
display: inline;
text-align: center;
margin: 1em;
padding: 1em;
}

Answer 2

将您的左从50%更改为25%

http://jsfiddle.net/ZW9Qp/

    #centermenu {
    float: left;
    width: 100%;
    border-bottom: 2px solid #011;
    background: #ffe;
    overflow: hidden;
    position: relative;
    }
    #centermenu ul {
    float: left;
    clear: left;
    position: relative;
    list-style: none;
    left: 25%;
    display: block;
    text-align: center;
    }
     #centermenu ul li {
    display: block;
    float: left;
    list-style: none;
    margin: 1em;
    padding: 1em;
}