不能让'li'项目以div为中心

Question

我无法将此列表正确地放在包含div中。它在左侧留下了一个边缘，我尝试了一些东西，但似乎无法改变它。我只是新的css，所以仍然在学习的过程中。提前感谢帮助

这是一个更好的例子：http://jsfiddle.net/aSmfy/

HTML

<div id="navContainer">
                        <ul>

                              <li><a href="add_contact.php">Add Contact</a></li>
                              <li><a href="list-contacts.php">List Contact</a></li>    

                        </ul>
                </div>

CSS

#navContainer {
    width: 192px;}

#navContainer ul{
    width: 192px;
    }

#navContainer li{
    list-style-type:none;
    border-top:thin solid white;
    border-bottom:thin solid white;}

Answer 1

在ul元素上填充0：

#navContainer ul{
    width: 190px;
    padding: 0;
}

http://jsfiddle.net/aSmfy/1/

Answer 2

添加：

margin:0;
padding:0;

到#navContainer ul

和：

 text-align:center;

到#navContainer li

它应该居中

Answer 3

解决方案一：

#navContainer {
width: 192px;
left: -20%;
position: relative;
}

检查此jSfiddle

解决方案二：

#navContainer li{
        list-style-type:none;
    border-top:thin solid white;
    border-bottom:thin solid white;
        margin:0;
        padding:0;
        text-align:center;
}   

检查此fiddle