IE stellt Liste mit CSS background image falsch dar

theprofessor · #1 (**permalink**) 25.04.2005, 19:47

Hi Leute,

habe für Listen CSS background images genommen ( siehe http://css.maxdesign.com.au/listamatic/vertical05.htm ), damit es keine Probleme gibt. Aber genau die gibt es leider im IE - wenn auch nur einem besonderen Fall.

Und zwar stellt der IE 6 die Images nicht dar, wenn die Liste in einem Div ein Bild rechts umfliest. Ohne das Bild werden die Bilder problemlos dargestellt.

Habe das Problem mal in den angehangenen Bildern beschrieben.

Link zu der Seite ist:
http://gastrotec-gmbh.devserver.home...ankanlagen.php

Vielen Dank für euren Rat!

Gruß, Max!

Swoop · #2 (**permalink**) 25.04.2005, 23:17

sind das list-style-images? probiers mal mit:

Zitat:

background: #farbe url(bild) no-repeat left center;

fürs[*]tag

theprofessor · #3 (**permalink**) 25.04.2005, 23:36

Dürfte nicht das Problem sein, hier der Auszug aus der CSS-Datei:

Code:

    #inhalt ul, ol {
      margin: 0;
      padding: 0;
    }

    #inhalt ul {
      list-style-type: none;
    }

    #inhalt ul li {
      background-image: url(/Bilder/Tools/Bullet.gif);
      background-repeat: no-repeat;
      background-position: 0 .45em;
      padding-left: 1em;
      margin-left: .5em;
    }

Swoop · #4 (**permalink**) 25.04.2005, 23:50

ok mehrere Möglichkeiten:

erstmal kannst du fürs Allgemeine sowas:

Zitat:

* {

margin: 0;
padding: 0;
}

definieren und dann nur wo du s brauchst welchen einsetzen..

bei der liste könntest du probieren die whitespaces zu entfernen da hat de rie noch so manches mal rumgesponnen..interessant dazu terrys Ausführungen Link hab ich grad nich parat einfach mal hier suchen im Forum..

dann könnte es auch sein, dass sich der ie an .45 stört, da das mit der Rundung immer so ne Sache ist..

fricca · #5 (**permalink**) 25.04.2005, 23:51

Sorry, aber ich finde es echt zu viel verlangt, mich durch diese Unmengen an Quelltext zu wühlen. Reduziere doch den Code auf das Problem und lass und das mal sehen.
Mir fällt auf, dass du viele floats ohne width-Angabe hast - damit hat der IE oft Schwierigkeiten.

Vielleicht hilft es bei deinem float-Problem, nicht die Bilder zu floaten, sondern den Text?

BTW: Bei deaktiviertem Javascript zerschießt der Firefox dein Layout bei mir komplett - das finde ich ein größeres Problem als nicht auftauchende Listenpunkte...

Grüße
fricca

PS: Das Wort heißt "Standard(-tresen)". Standart ist was anderes...

theprofessor · #6 (**permalink**) 25.04.2005, 23:58

Zitat:

Zitat von Swoop

ok mehrere Möglichkeiten:

erstmal kannst du fürs Allgemeine sowas:

Zitat:

* {

margin: 0;
padding: 0;
}

definieren und dann nur wo du s brauchst welchen einsetzen..

bei der liste könntest du probieren die whitespaces zu entfernen da hat de rie noch so manches mal rumgesponnen..interessant dazu terrys Ausführungen Link hab ich grad nich parat einfach mal hier suchen im Forum..

dann könnte es auch sein, dass sich der ie an .45 stört, da das mit der Rundung immer so ne Sache ist..

* {

margin: 0;
padding: 0;
}

Hatte ich schon gesetzt ...

Whitespaces kann ich an der Position nicht entfernen ... das Ganze läuft in einem CMS ... Problem würde also früher oder später wieder auftauchen, wenn ein Redakteur nicht auf sowas achten würde (was auch passiert).

Und aus .45 einfach .4 zu machen hat leider auch nicht geholfen

...

Der Witz ist ja, dass IE es anzeigt, wenn das Bild nicht links daneben ist ... Beispiel:
http://gastrotec-gmbh.devserver.home...0/Gasherde.php

fricca · #7 (**permalink**) 26.04.2005, 00:04

Zitat:

Zitat von theprofessor

Der Witz ist ja, dass IE es anzeigt, wenn das Bild nicht links daneben ist ... Beispiel:
http://gastrotec-gmbh.devserver.home...0/Gasherde.php

Die Bilder sind auch im anderen Fall da, nur sitzen sie unter dem gefloateten Bild. Das sieht man, wenn man deine Seite lokal abspeichert und die Bilder nur als Platzhalter angezeigt werden...
Versuch die Listenpunkte doch mal als list-style-images einzusetzen (mit list-style-position:inside)

Grüße
fricca

theprofessor · #8 (**permalink**) 26.04.2005, 00:05

Zitat:

Zitat von fricca

Sorry, aber ich finde es echt zu viel verlangt, mich durch diese Unmengen an Quelltext zu wühlen. Reduziere doch den Code auf das Problem und lass und das mal sehen.
Mir fällt auf, dass du viele floats ohne width-Angabe hast - damit hat der IE oft Schwierigkeiten.

Vielleicht hilft es bei deinem float-Problem, nicht die Bilder zu floaten, sondern den Text?

BTW: Bei deaktiviertem Javascript zerschießt der Firefox dein Layout bei mir komplett - das finde ich ein größeres Problem als nicht auftauchende Listenpunkte...

Grüße
fricca

PS: Das Wort heißt "Standard(-tresen)". Standart ist was anderes...

Sorry, wegen dem vielen Quelltext, Problem taucht nur auf dieser Seite auf ...

Bei den Bildern auf der linken Seite kann ich leider keine width angeben, da die Bilder unterschiedlich groß sein können. Auf der rechten Seite ist die width angegeben, da ich da durch das CMS die Breite auf 140 Pixel festlegen lasse.

Hast Du denn einen Vorschlag, wie ich statt der floatenden Bilder den Text zwischen die beiden Bilder floaten kann? Ich komme leider nicht drauf.

Das Problem mit dem deaktviertem JS kenne ich, musss für das Menü bei Fertigstellung der Seite nur noch eine statische CSS-Datei generieren lassen, dann hat sich das Problem erledigt.

Danke für den Hinweis auf Standart

... Text hat ein Redakteur verbrockt ... ich arbeite nur am Layout ... werde aber gleichmal verbessern

...

Swoop · #9 (**permalink**) 26.04.2005, 00:07

naja zur Not müsste man das cms eben anpassen, das ist das Problem wenn jeder ein CMS haben will heutzutage

falls nicht schon geschehen könntest du um das bild mal bisl mit margin polstern ansonsten muss ich fricca da zustimmen ganz schön viel zu später stunde

theprofessor · #10 (**permalink**) 26.04.2005, 00:08

Zitat:

Zitat von fricca

Zitat:

Zitat von theprofessor

Der Witz ist ja, dass IE es anzeigt, wenn das Bild nicht links daneben ist ... Beispiel:
http://gastrotec-gmbh.devserver.home...0/Gasherde.php

Die Bilder sind auch im anderen Fall da, nur sitzen sie unter dem gefloateten Bild. Das sieht man, wenn man deine Seite lokal abspeichert und die Bilder nur als Platzhalter angezeigt werden...
Versuch die Listenpunkte doch mal als list-style-images einzusetzen (mit list-style-position:inside)

Grüße
fricca

Hatte ich auch schon probiert ... es ist zum verzweifeln ... klappt auch nicht .. Text wird dann zwar eingerückt, aber es scheint, als ob die Grafik-Bullets dann vom Bild verdeckt werden.

BTW, die Grafik-Bullets hab ich nur genommen, da der IE genauso rumzickte, als ich ganz normale ul's verwendete ...

Gruß, Max!

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Ansicht
Linear-Darstellung Zur Hybrid-Darstellung wechseln Zur Baum-Darstellung wechseln

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
navigation funktionert auf Tablet nicht	leverkusenerjung	CSS	1	10.01.2016 19:39
Ausrichtung Kalender	greece4u	CSS	20	14.05.2012 13:32
Inline Listenelement wird nicht richtig im background befüllt	SteveB	CSS	3	28.04.2011 20:41
CSS Problem - Finde den Fehler nicht...	expou	CSS	4	27.04.2011 12:31
Warum stellt IE Seite falsch dar?	sunny55	CSS	6	08.09.2008 12:59