html - 如何将没有设置宽度的列表块居中？

Question

我正在处理一个UL可以缩小和增长的块，一个导航菜单。它充满了向左浮动的列表项，并且是用户定义的任意长度。它没有固定宽度，我无法更改 HTML 或使用 javascript。我所能做的就是添加CSS。使列表居中的最安全方法是什么？

我必须使用的一个简单示例：http: //jsfiddle.net/DCYn2/1/ 请记住，我只能添加 CSS。我无法添加 html、js 或删除现有的 css。

Answer 1

使 ul 居中的最简单方法是将其 display 属性更改为 table 并修改边距。

http://tinker.io/c5ff0

ul {
    border: 1px solid;
    padding: 0;
    display: table;
    margin-left: auto;
    margin-right: auto;
}

li {
    border: 1px solid red;
    display: inline-block;
}