liste zentriert ausgeben

[ahnungslos]

Hallo!
Ich habe ein Problem und weiß im Moment nicht weiter.
Folgendes Problem:

ich habe ein div in dem 2 Listen ausgegeben werden:

  
<div id="divid">  
  <ul id="liste1">  
    <li class="erster">  
      <a href="google.de">foobar</a>  
    </li>  
    <li>  
      <a href="yahoo.de">foobar</a>  
    </li>  
    <li>  
      <a href="web.de">foobar</a>  
    </li>  
  </ul>  
  <ul id="liste2">  
    <li class="erster">  
      <a href="google.de">foobar</a>  
    </li>  
    <li>  
      <a href="yahoo.de">foobar</a>  
    </li>  
    <li>  
      <a href="web.de">foobar</a>  
    </li>  
  </ul>  
</div>  

Das css dazu:

  
div#divid ul#liste1{float:left; padding: 8px 20px; width:950px;}  
div#divid ul#liste1 li{float:left; display:inline;}  
div#divid ul#liste1 li.erster a{padding-left:0;}  
div#divid ul#liste1 li a{color: black; padding: 0 10px 0 13px;}  
  
div#divid ul#liste2{background:red; float:left; padding:8px 20px; width:950px;}  
div#divid ul#liste2 li{float:left; clear:none; padding-left:20px; padding-right:20px; width:auto;}  
div#divid ul#liste1 li.erster{padding-left:0;}  

Ich hoffe das war alles wichtige.
Nun will ich die 2te Liste zentriert anzeigen.
Wenn ich aber dem UL tag die Eigenschaft text-align:center; gebe, dann passiert nichts. Ich probiere nun schon seit bestimmt einer Stunde das zu zentrieren, aber es klappt nicht.
Seht ihr meinen Fehler?

Grüße