如何将无序列表保持在屏幕中心？

Question

我在div中有以下无序列表：

<div id="footer">
    <ul>
        <li>Blog</li>
        <li>|</li> 
        <li>About Us</li> 
        <li>|</li> 
        <li>Privacy Policy</li> 
        <li>|</li> 
        <li>Copyright</li> 
        <li>|</li> 
        <li>Contact Us</li> 
        <li>|</li> 
        <li>Press Inquiries</li>
    </ul>
</div>

无论窗口的宽度如何，我希望这个页脚文本在屏幕中保持居中。我怎么用CSS？

这样做

Answer 1

#footer{
   text-align:center; 
}

Answer 2

无论

#footer_list {text-align:center;}

或

#footer_list {width:500px; margin:0 auto;}

Answer 3

This tutorial部分描述了如何执行此操作。

Answer 4

通过使用相对定位也可以center a floated list。

Answer 5

ul {
    padding:0;
    margin:0;
}
li {
    width: 300px;
    margin: auto;
}