Caro: Im IE7 Lücken zwischen den Buttons der Navigation

Beitrag lesen

Hallo Leute!

Folgendes Problem:
Ich bastel im Moment eine Seite, bei der die Navigation oben horizontal angezeigt werden soll. Es handelt sich dabei um zwei ineinander verschachtelte Listen.

<ul>
    <li>1</li>
    <li>2
        <ul>
            <li>2.1</li>
            <li>2.2</li>
        </ul>
    </li>
</ul>

2.1 und 2.2 sollen erst erscheinen, wenn man mit der Maus über Punkt 2 fährt. Die einzelnen Punkte/Links sind aber kein Text, sondern Buttons.

Das ganze hab ich mit CSS gelöst. Funktioniert auch alles super, sowohl im FF als auch im IE7 (andere müssen noch warten). Allerdings hab ich im IE7 Lücken zwischen den Buttons 2.1 und 2.2. In diesen Lücken ist allerdings nicht die Hintergrundfarbe der Navigation zu sehen. Die Lücken sind quasi transparent und man sieht die Seite, die sich dahinter befindet.

Kann ich diese Lücken irgendwie weg bekommen?

Hier der CSS-Quellcode:

div#Tmenu
    {
        width: 877px;
        padding: 0em;
        border: 0px;
        background-color: #fff;
    }

div#Tmenu div
    {
        clear: left;
    }

ul#Navigation
    {
        margin: 0; padding: 0;
        border: 0px;
    }

ul#Navigation li
    {
        list-style: none;
        float: left;
        position: relative;
        margin: 0em; padding: 0;
    }

ul#Navigation li ul
    {
        margin: 0; padding: 0;
        position: absolute;
        top: 2.1em; left: 0.35em;
    }

ul#Navigation li ul li
    {
        float: none;
        display: block;
        margin-top: 0em; margin-bottom: 0em;
        padding: 0;
        border: 0px;
    }

ul#Navigation a
    {
        display: block;
        width: 146px;
        text-decoration: none;
        padding: 0em 0em 0em 0em;
        border: 0px;
        color: white; background-color: #fff;
    }

ul#Navigation a:hover
    {
        padding: 0em 0em 0em 0em;
    }

ul#Navigation li ul li a
    {
        display: block;
        width: 134px;
        text-decoration: none;
        margin: 0em;
        padding: 0em 0em 0em 0em;
        border: 0px;
        background-color: #fff;
    }

/* dynamisches Ein-/Ausblenden */
    ul#Navigation li ul
    {
        display: none;
    }

ul#Navigation li:hover ul
    {
        display: block;
    }

Für eure Hilfe wäre ich sehr dankbar.