如何正确居中菜单

Question

如何正确居中此页面上的菜单http://bit.ly/An65z5？现在已经在萤火虫上捅了一个多小时，请帮忙:)。

Answer 1

请看一下这个链接：http://matthewjamestaylor.com/blog/beautiful-css-centered-menus-no-hacks-full-cross-browser-support

Answer 2

在style.css中，添加最后附加以下代码行。

#top-menu {
    float: none;
    padding-left: 0;
    padding-top: 10px;
    width: 271px;
    margin: 0 auto;
}

Answer 3

从＃top-menu中删除float：left属性，设置margin：0 auto;并添加宽度。您也可以删除＃top-menu左侧的填充，因为导航居中后不需要。所以它应该如下所示：

#top-menu {
    width: 300px; /* 300px will need to change to the actual width of your nav element */
    margin: 0 auto;
    padding-top: 10px;
}

Answer 4

看一下这个例子：http://jsfiddle.net/ialphan/EF9dK/

Answer 5

为了避免限制容器宽度的有害需求，请对{居中块}使用display: table，为其子元素使用display: table-cell。