list-style-type Problem mit IE6/7 und Mozilla

Status
Nicht offen für weitere Antworten.

son gohan

Erfahrenes Mitglied
Hallo,

ich habe einer Liste Bilder als list-style-type gegeben. Im IE 6 und 7 sieht es gleich aus aber im Mozilla 2.0 und vielleicht auch andere Versionen davon sieht anders aus.

1. Im Mozilla sind die list-style-type Bilder viel zu weit link, obwohl ich mit margin erst alles auf 0 und dann nochmal spezielle positioniert habe.

2. Im Mozilla wird ein Abstand zwischen dem Inhalt der Listentags und den list.style-type Bilder gemacht aber im IE 6 und 7 nicht.

Ich hab ein Bild unten dazu gemacht und hier die CSS, bitte um Hilfe, ich bekomme es nicht hin das es in beiden Browsern einigermaßen gleich aussieht.

CSS:
PHP:
* { margin:0; padding:0; }
ul#suchw {
list-style-image:url("bild/edit-find.png");text-align:left;border:1px solid #fff;margin:0 0 0 19px
}
ul#suchw li {padding:3px 0 3px 0px;}
ul#suchw li a, ul#suchw li a:link, ul#suchw li a:active, ul#suchw li a:visited {
text-decoration:none;
background:#003f00;
color:#fff;
}
ul#suchw li a:hover {
text-decoration:underline;
}
 

Anhänge

  • 27813attachment.jpg
    27813attachment.jpg
    31,1 KB · Aufrufe: 95
Hi,

arbeite doch anstelle von list-style-image mit der background-image- bzw. background-Eigenschaft, um die Grafik als Hintergrundbild für die Listenpunkte li zu definieren. Dann gibt's auch keine Darstellungsunterschiede in den verschiedenen Browsern.

Wenn ich mich recht erinnere, habe ich dir aber schon mal dazu geraten.


[editpost]

Hab den Thread gefunden -> ul Listen Image
 
Hi,

jetzt wo du es sagst kann ich mich doch wieder dran erinnern.

Mein argument wäre jetzt das es nicht ganz so semantisch für mich aussieht weil ich an dieser Stelle eine Liste haben wollte wo halt was aufgelistet wird und dazu ja ein ul Tag genommen wird, aber naja dann überleg ich es mir halt nochmal, wenn es ja sowieso keine andere Möglichkeit gibt.
 
Du kannst das ul-Element ja auch weiterhin verwenden, nur eben die empfohlene CSS-Formatierung auf das li-Element anwenden. ;)
 
Status
Nicht offen für weitere Antworten.
Zurück