title: Centering block menu `<li>` elements in a `<div>`
body: <p>This should be an easy one - I'm just missing something simple, I'm sure.</p>
  
  <p>I have a header and want a nested, centered horizontal menu.</p>
  
  <pre><code>#header {
      background:url(images/headers/header.gif);
      margin: 0 auto;
      height: 207px;
      width: 100%;
  }
  
  /* =Menu
  -------------------------------------------------------------- */
  
  #access {
      background: transparent;
      display: block;
      text-align: center;
      float: left;
      margin: 150px auto 0;
      width: 940px;
  }
  #access .menu-header,
  div.menu {
      font-size: 13px;
      margin-left: 120px;
      width: 766px;
  }
  #access .menu-header ul,
  div.menu ul {
      list-style: none;
      margin: 0 auto;
  }
  #access .menu-header li,
  div.menu li {
      background-color: #444;
      margin: 0 auto;
      float: left;
      text-align: center;
      width: 110px;
      position: relative;
  }
  #access a {
      color: #aaa;
      display: block;
      line-height: 38px;
      padding: 0 10px;
      text-decoration: none;
  }
  #access ul ul {
      box-shadow: 0px 3px 3px rgba(0,0,0,0.2);
      -moz-box-shadow: 0px 3px 3px rgba(0,0,0,0.2);
      -webkit-box-shadow: 0px 3px 3px rgba(0,0,0,0.2);
      display: none;
      position: absolute;
      top: 38px;
      left: 0;
      float: left;
      width: 180px;
      z-index: 99999;
  }
  #access ul ul li {
      min-width: 180px;
  }
  #access ul ul ul {
      left: 100%;
      top: 0;
  }
  #access ul ul a {
      background: #333;
      line-height: 1em;
      padding: 10px;
      width: 160px;
      height: auto;
  }
  #access li:hover &gt; a,
  #access ul ul :hover &gt; a {
      background: #444;
      color: #fff;
  }
  #access ul li:hover &gt; ul {
      display: block;
  }
  #access ul li.current_page_item &gt; a,
  #access ul li.current-menu-ancestor &gt; a,
  #access ul li.current-menu-item &gt; a,
  #access ul li.current-menu-parent &gt; a {
      color: #fff;
  }
  * html #access ul li.current_page_item a,
  * html #access ul li.current-menu-ancestor a,
  * html #access ul li.current-menu-item a,
  * html #access ul li.current-menu-parent a,
  * html #access ul li a:hover {
      color: #fff;
  }
  </code></pre>
  
  <p>site: <a href="http://74.86.183.200/~riaharb/stage/" rel="nofollow">http://74.86.183.200/~riaharb/stage/</a></p>
  
  <p>Thanks in advance!</p>