title: can't center my nav bar
body: <p>I have the following code for my nav bar and can't seem to center it on the website. What am I doing wrong? Removing float: left does nothing for positioning.
  Thanks.</p>
  
  <p>css</p>
  
  <pre class="lang-css prettyprint-override"><code>ul#list-nav {
      list-style: none;
      margin: 20px auto;
      padding: 0px;
      width: 800px;
  }
  
  ul#list-nav li {
      display: inline;
  }
  
  ul#list-nav li a {
      text-decoration: none;
      padding: 5px 0;
      width: 100px;
      float: left;
      background: #485e49;
      color: #eee;
      text-align: center;
      border-left: 1px solid #fff;
  }
  
  ul#list-nav li a:hover {
      background: #a2b3a1;
      color: #000
  }
  </code></pre>
  
  <p>html</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;/head&gt;
  &lt;body&gt;
      &lt;div id="as"&gt;
          &lt;ul id="list-nav"&gt;
              &lt;li&gt;&lt;a href="#"&gt;Home&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="#"&gt;About Us&lt;/a&gt;&lt;/li&gt;
          &lt;/ul&gt;
      &lt;/div&gt;
  &lt;/body&gt;
  </code></pre>