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

Question

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

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

Answer 1

使 ul 居中的最简单方法是将其显示属性更改为表格并修改边距。

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;
}