使用CSS将左侧float <li>居中一个<ul>列表

Question

我必须重现这样的菜单:

+----------------------------------------------------------------------------+
        Option 1  |  Option 2  |  Option 3  |  Option 4  |  Option 5
+----------------------------------------------------------------------------+

但实际上我有这个:

+----------------------------------------------------------------------------+
Option 1  |  Option 2  |  Option 3  |  Option 4  |  Option 5
+----------------------------------------------------------------------------+

我的代码:

<ul>
    <li>Option 1</li>
    <li>Option 2</li>
    <li>Option 3</li>
    <li>Option 4</li>
    <li>Option 5</li>
</ul>

我对该代码的实际css是:

ul { list-style: none outside none; margin:0; padding: 0; }
li { float: left; margin: 0 10px; }

我怎么能这样做？

PD:尽可能使用IE7替代方案.

先感谢您!

Answer 1

li改为使用此代码:

li { margin: 0 10px; display: inline; }

并集中你ul的内容:

ul { list-style: none outside none; margin:0; padding: 0; text-align: center; }