CSS: Horizontale Sidebar will nicht so wie ich.

Ich bin am Verzweifeln. Ich habe ein CSS-Problem, zumindest vermute ich das. Meine Sidebar ist horizontal und stellt ein Submenü dar. Nun möchte ich, dass die einzelnen li`s mit einem Rollover belegt werden, so dass der Eindruck einer Reiternavigation entsteht.

Leider kriege ich es einfach nicht gebacken, einen Abstand zwischen die einzelnen Punkte zu legen, die Hintergrundfarbe, die eigentlich nur ein Navi-Punkt haben soll, zieht sich durch den ganzen Navi-Bereich. Ein normaler Link soll also mit der Farbe #62769e2 hinterlegt sein, Rollover und Aktiv mit #051432. Dazwischen soll ein kleiner grauer Abstand sein, also KEIN durchgängiges #62769e!

Zu allem Übel sieht die Navi im FF und IE7 auch noch leicht unterschiedlich aus... :-(

Hier noch das meiner Meinung nach relevante CSS:

#sidebar ul {
    margin: 0px;
    padding: 0px;
    list-style-type: none; 
    list-style-image: none;
    font: 10pt/100% Arial, Helvetica, sans-serif;
}
#sidebar li {   
  
    float: left;
}
#sidebar li a, #sidebar li a:visited, #sidebar .page_item {
    text-decoration: none;
    color: #ffffff;
     margin: 0px;
     padding: 5px 5px 5px 5px;
    background:#62769e;
}
#sidebar .current_page_item a, #sidebar .current_page_item a:visited {
    color: #ffffff;
    background:#051432;
}
#sidebar li a:hover {
    text-decoration: none;
    color: #ffffff;
    background:#051432;
        
}

Weiß jemand Rat?

Jupp, das wars!
Da hab ich den Wald vor lauter css wohl nicht mehr gesehen.
Danke Dir!

Und nochmal ich, selbe Baustelle.

Das Menü hab ich jetzt fast so wie ich es wollte. Nachteil: Nur im Firefox*

Im Internet-Explorer wird das Padding ignoriert. Wie müsste ich denn das CSS für den IE anpassen, damit er mir die Links mit einem Abstand rundherum anzeigt, OHNE dass sich der Abstand zwischen den <li>'s vergrößert UND das Rollover noch funktioniert?

Dann würde sich wohl auch das Problem mit den runden Ecken erledigen denn wie Ihr seht ist im Firefox links oben in den Reitern eine runde Ecke. Wollte das hier nachbaun: Reiternavigantion mit CSS. Die Ecke hätte ich gerne auch rechts, wenn ich

<span class="r">&nbsp;</span>

allerdings in includes/classes.php in Zeile 521 einfüge, erscheint die rechte
Ecke zwar, klebt aber direkt am Link-Wort und nicht in der Ecke wo sie hingehört...

Hat jemand Rat für mein 2in1-Problem?

Achja, hier das relevante CSS:

#sidebar ul {
    margin: 0px 0px 0px 10px;
    padding: 0px;
    list-style-type: none; 
    list-style-image: none;
    font: 10pt/100% Arial, Helvetica, sans-serif;
}
#sidebar li {   
  
    float: left;
}
#sidebar li a, #sidebar li a:visited {
    text-decoration: none;
    color: #ffffff;
    padding: 6px 6px 0px 6px;
    background:#62769e url('http://www.jenbachweb.de/hauke/wp-content/themes/default/images/lo-o.gif') top left no-repeat;
    
} 


#sidebar .page_item {
    text-decoration: none;
    color: #ffffff;
    padding: 1px;
}


#sidebar .current_page_item a, #sidebar .current_page_item a:visited {
    color: #ffffff;
    background:#051432 url('http://www.jenbachweb.de/hauke/wp-content/themes/default/images/lo.gif') top left no-repeat;
}
#sidebar li a:hover {
    text-decoration: none;
    color: #ffffff;
    background:#051432 url('http://www.jenbachweb.de/hauke/wp-content/themes/default/images/lo.gif') top left no-repeat;
}

Viele Grüße,
Andi

Um ehrlich zu sein kann ich mir grad nicht erklären warum ich es mit einer Tabelle gemacht habe...

Je mehr ich mich in ein Problem reinfresse, desto irrer werden bei Zeiten die Lösungen und das Forum ist halt immer erst die letzte Instanz kurz vor dem Herzinfarkt. ;-)

Vielen Dank für Deine Antwort, ich melde mich dann und verzähl, obs geklappt hat!