title: Centering a Float Left Menu with Unknow Width
body: <p>I want to the Li Element of the Ul of my menu are in the Center, I tried a lot of methods but it is not going on. Take a look on my css:</p>
  
  <pre><code>#menu {
      float: left;
      width: 767px;
      height: 38px;
      margin: 11px 0 0 14px;
      background: url(images/menubg.gif) repeat-x;
      -webkit-border-radius: 0px 0px 7px 7px;
      border-radius: 0px 0px 7px 7px;
      border: 1px solid #efeff1;
  }
      #menu ul {
          list-style: none;
          text-align: center;
          padding: 0;
          margin: 0;
          height: 40px;
      }
          #menu ul li {
              float: left;
              color: #767676;
              height: 18px;
              padding: 11px 0px 11px 0px;
              display: inline;
          }
              #menu ul li a {
                  font-family: Arial, Helvetica, sans-serif;
                  color: inherit;
                  font-size: 12px;
                  text-decoration: none;
                  font-weight: bold;
                  display: block;
                  padding: 0px 23px 2px 23px;
                  border-left: 1px solid #e0e0e2;
              }
  </code></pre>
  
  <p>I tried display: inline, text-aling: center, but it doesnt get right.
  Thanks a lot in Advance.</p>