如何使导航菜单居中

Question

我想把菜单放在中心但我无法弄清楚如何做到这一点。我试过翻转CSS但没有运气。不仅如此，它甚至无法与我放置的导航栏正确对齐。

这是我的代码

<div id="nav">
<ul>
<li><a href="http://www.nba.com/playoffs/"> HOME </a></li>
<li><a href="https://www.yahoo.com/"> ABOUT </a></li>
<li><a href="http://mlb.mlb.com/home"> SERVICES </a></li>
<li><a href="http://www.buzzfeed.com/"> BED & BREAKFAST </a></li>
<li><a href="http://www.fau.edu/"> CONTACT </a></li>
</ul></div>

这是我的CSS

#nav {
width:960px;
height:30px;
margin:0 auto;
padding-top:5px;
background-color:#e5cb50;
font-color:#d45528;
font-family:"Poppin", sans-serif;
font-weight:600;
font-size:15px;
}

#nav ul {
list-style-type:none;
overflow:auto;
}

#nav ul li {
border-bottom:none;
letter-spacing:0.1em;
}

#nav ul li a {
text-decoration:none;
padding:0px 0px 30px 20px;
align-content:center;
color:#d45528;
float:left;
 }

#nav ul li a:hover {
color:#4e4849;
}

#nav ul li.noline {
border-right:none;
}