中心李在IE中一个CSS菜单元素？

Question

我需要中心具有一个未知的宽度的CSS菜单。我找到了解决办法。通过设置UL标签显示：表或显示：直列表LI元件可以在中心对齐

此溶液不工作在IE。有另一种解决方案，在IE浏览器，只用HTML / CSS？

如果你想在我的代码好好看看我已经贴在这里 。

Answer 1

这个怎么样？对我的作品在IE6，IE7，Firefox浏览器。

标记：

<div id='menu-centered'>
    <ul>
        <li><a href="">My first item</a></li>
        <li><a href="">My second item</a></li>
        <li><a href="">My third item</a></li>
        <li><a href="">My fourth item</a></li>
        <li><a href="">My fifth item</a></li>
    </ul>
</div>

CSS：

#menu-centered {
    background-color: #0075B8;
    padding: 10px;
    margin: 0;
}

#menu-centered ul {
    text-align: center;
    padding: 0;
    margin: 0;
}

#menu-centered li {
    display: inline;
    list-style: none;
    padding: 10px 5px 10px 5px;
}

#menu-centered a {
    font: normal 12px Arial;
    color: #fff;
    text-decoration: none;
    padding: 5px;
    background: #57a8d6;
}

#menu-centered a:hover {
    background: #5fb8eb;
}

到整个事情的关键是基本上做text-align: center;元件上<ul>。你也从来没有真正想要做的东西一样display: table; - 它只是hackish的，当你发现不能在所有浏览器上运行。由于这种方式避免了漂浮你也不需要有明确的因素在里面，虽然你可能已经删除了，反正通过增加overflow: auto;到<ul>。希望它帮助。