title: centering <ul> <li> horizontal drop down menu
body: <p>I've been unable to center this horizontal list drop down menu. Will I have to rework all the css because i'm using a float left?</p>
  
  <p>
  Here is all the code pertaining to the position of the list. 
  or alternatively click here to view it live</p>
  
  <pre><code>.megamenu {
  margin:auto;
  position:absolute;
  margin:0;
  width:100%;
  font-size:1.182em;
  list-style:none;
  padding:0px;
  line-height:38px;
  font-weight: bold;
  display:block;
  list-style:none;
  border-right: none;
  top: -1px;
  list-style-type:none;
  list-style-position:inside;
  
  
  
  
  .megamenu &gt; li {
  
      display:inline;
      border:none;
      margin:0;
      float:left;
      padding: 0px 0 0px 30px;
      -webkit-transition: background-color 0.4s ease-out;
      -moz-transition: background-color 0.4s ease-out;
      -o-transition: background-color 0.4s ease-out;
      -ms-transition: background-color 0.4s ease-out; 
      border-right: none;
      transition: background-color 0.4s ease-out;
  
  }
  </code></pre>
  
  <p>any help would be greatly appreciated </p>