html中心对齐不起作用

Question

我正在尝试将 ul 与 div 的中心对齐，但它在这里不起作用是因为我的 HTML 代码是:

<div id="container">  
  <div id="footer">  
    <ul id="footer_links">  
      <li><a href="...">About</a></li>  
      <li><a href="...">Faq</a></li>  
      <li><a href="...">How Rang De Works</a></li>  
      <li><a href="...">Contact</a></li>  
      <li><a href="...">Support</a></li>  
    </ul>  
  </div>  
<div>  

我的 CSS 是:

#container {width:975px;margin:0 auto;}  
#footer {text-align:center;}  
ul#footer_links {margin:0px;text-align:center;}  
ul#footer_links li {float:left; list-style:none; padding:10px 0px 0px 20px;}

链接到 HTML code

Answer 1

从 ul#footer_links li 中移除 float: left 并改用 display: inline

JSFiddle:http://jsfiddle.net/Efbjv/1/