ratei8: Navigation mit Listen - Abstände bei IE

Hallo,
ich hoffe, dass es diese Frage nicht schon häufiger gab, denn das Problem scheint mir sehr grundlegend zu sein. Aber ich konnte nichts darüber finden.

Hier also das Problem:
Ich versuche, eine ordentliche Navigation mit Listen zu erstellen, wie es allgemein empfohlen wird. Mit Firefox und Opera sieht es auch so aus, wie ich es mir vorstelle. Aber IE macht immer etwas größere Abstände zwischen die (vertikal angeordneten) Links.

Gibt es für dieses Problem eine Lösung, oder muss man damit leben?

(Ich benutze eine IE-Version 5.x - Version 6 scheint das selbe Bild zu erzeugen, wurde mir berichtet von einem Bekannten, der es getestet hat.)

Hier der Quellcode fürs CSS:

ul {
 list-style-type:none;
}
li {
 width:100px;
 height:20px;
 background-color:#888888;
 border: 1px solid black;
 text-align:center;
 margin:2px;
}
li a {
 color:white;
 text-decoration:none;
}

  1. hi,

    Kurzgefasst hast du das Typische <http://onhavinglayout.fwpf-webdesign.de/@title
    =hasLayout> Problem.

    Kurzgefasst umgehst du es mit einem height: 1%; für die a:link im IE.

    grüße

    --
    I have a Dream...
    Bugs erzeugen gegenbugs.
    Wir müssen Bugs mit Bugs bekämpfen!
    1. Danke für die Antwort.
      Leider funtioniert das mit dem height:1% bei mir nicht. Das Aussehen wird dadurch nicht geändert.
      Ich habe einiges über das "hasLayout" gelesen, verstehe aber nicht wirklich, was das zu bedeuten hat und wie dadurch ein Fehler entsteht bzw. wie er behoben werden kann.

      Was kann ich jetzt noch versuchen? Man sollte vielleicht die Navigation mit Tabellen realisieren, denn man kann ja schlecht auf einen Browser verzichten, der immer noch von einem großen Anteil der User benutzt wird.

      1. hi,

        Leider funtioniert das mit dem height:1% bei mir nicht. Das Aussehen wird dadurch nicht geändert.

        Was hast du wo geändert? Hast du die Seite Online?

        Ich habe einiges über das "hasLayout" gelesen, verstehe aber nicht wirklich, was das zu bedeuten hat und wie dadurch ein Fehler entsteht bzw. wie er behoben werden kann.

        Fehler passieren nur in den IE 6, bei den kleineren weiss ich jetzt auf anhieb nicht.
        Das ist ein kleiner Bug, viele Elemente, die falsch dargestellt werden benötigen ein height:1%; für IE 6 und kleiner damit sie korrekt dargestellt werden.

        Was kann ich jetzt noch versuchen? Man sollte vielleicht die Navigation mit Tabellen realisieren, denn man kann ja schlecht auf einen Browser verzichten, der immer noch von einem großen Anteil der User benutzt wird.

        Fallback zwecks Usability. :) Nööö. Bleib am Ball, was hast du denn bisher versucht?

        ul {  
        }  
        li {  
        }  
        li a, li a:link, li a:visited {  
         color:white;  
         text-decoration:none;  
        }  
        * html li a,  
        * html li a:link,  
        * html li a:visited {  
         height: 1%;  
        }
        

        grüße

        --
        I have a Dream...
        Bugs erzeugen gegenbugs.
        Wir müssen Bugs mit Bugs bekämpfen!