serotonic: Listen-Menü: IE Problem bei display: list-item;

Ich habe ein Menü mit Listen erstellt, in welchem bei a:hover und a:active ein Listensymbol angezeigt werden soll.

Nun habe ich das Problem, dass der IE(6) beim scrollen über einen Menüpunkt unterhalb des Punktes ca. 10px Abstand "hinzuinterpretiert" und die anderen Punkte runterschiebt.

CCS:

li a:hover,
li a:active {
 display: list-item;
 list-style-type: none;
 list-style-image: url("../images/punkt.gif");
}

Ein Hinzufügen von margin: 0px; und padding: 0px; oder sonstige feste Höhenangaben führen zu keinerlei Änderung im IE.

Nehme ich "display: list-item;" raus, funktioniert es im IE einwandfrei, jedoch wird im Mozolla das Listensymbol nicht angezeigt.

Hat jemand eine Idee, wie ich dem IE beibringen könnte, dass er bei meinem Menü mitspielt?

  1. Hallo,

    li a:hover,
    li a:active {
     display: list-item;
     list-style-type: none;
     list-style-image: url("../images/punkt.gif");
    }

    display: list-item is not supported by Explorer 5 Windows (and Netscape 4, of course).

    Der Mozilla läst es freilich weg, da ja der Link nicht mehr als ein Listenpunkt dargestellt wird, und somit auch kein -type und -image haben kann.

    Hat jemand eine Idee, wie ich dem IE beibringen könnte, dass er bei meinem Menü mitspielt?

    Nun ich würde einfach das Listensymbol weglassen, und dafür mit Hintergrundbildern arbeiten. Also ungefär so:

    li a:link {
     padding-left: 20px;
     background-image: none;
     display: block;
    }
    li a:hover, li a:active {
     background: url("../images/punkt.gif") no-repeat 0 50%; /* oder die Zahlen umgekehrt weiß nicht mehr auswendig */
    }

    Alles ungetestet, musst mal ausprobieren obs genau so funktioniert wie du es haben willst.

    Grüße
    Jeena Paradies

    --
    Ich bin mir ziemlich sicher dass es im Leben mehr gibt als nur wirklich wirklich gut auszusehen ...
    <img src="http://home.arcor.de/vivosomuertos/self/zoolander.jpg" border="0" alt="">
    Bambergs Fasching - nur ein großer (Werbe-)Flop?
    http://jeenaparadies.de/artikel/fasching/
    Jeenas Bannertauschportal; selbstgemacht ;-)
    http://jeenasbannerbude.de
  2. Hallo,

    Nun habe ich das Problem, dass der IE(6) beim scrollen über einen Menüpunkt unterhalb des Punktes ca. 10px Abstand "hinzuinterpretiert" und die anderen Punkte runterschiebt.

    ...

    li a:hover,
    li a:active {
     display: list-item;
     list-style-type: none;
     list-style-image: url("../images/punkt.gif");
    }

    ...

    Hat jemand eine Idee, wie ich dem IE beibringen könnte, dass er bei meinem Menü mitspielt?

    mit float bei ul und li:

    ul {float:left;}
    li {float:left;clear:left}

    ähnlich wie  hier mit CSS-Weiche beschrieben: http://www.lipfert-malik.de/webdesign/tutorial/bsp/listenCSSmenu.html

    Grüsse

    Cyx23