Problem mit Anordnung von DIV Container im IE

X

xtramen01

Erfahrenes Mitglied
Hallo Leute,

habe ein kleines Darstellungsproblem im aktuellen IE bei aktivierter Kompatibilitätsansicht.

Und zwar alles was nach dem DIV mit Inhalt "{$list.bild}" kommt rutscht, wie der angegebene margin-left Wert, nach rechts. Das ist auch so gewollt.

Nur bezieht sich der margin-left Wert nicht auf das DIV mit dem Inhalt "{$list.bild}", sondern auf die Linke Seite des Umschließenden DIVs (id=1). So wäre es gewollt und wird auch ohne Kompatibilitätsansicht so dargestellt.

Leider nur nicht wenn diese aktiviert ist.

Hat jemand eine Idee?

HTML: 
<div id="1" style="margin:2px; border:1px solid #e5e5e5; text-align:left; background:#ffffff; padding:2px;">
<div style="z-index:2; position:absolute; margin-left:115px; margin-top:2px;">{$list.top_produkt}</div>
<div style="position:relative; float:left; text-align:left; padding-left:15px; padding-top:15px; border-right:1px solid #e1e1e1; width:130px;">{$list.bild}</div>
<div style="z-index:3; position:absolute; margin-left:155px; margin-top:5px; width:619px; font-size:12px;">{$list.produkt_name}</div>
<div style="z-index:4; position:absolute; margin-left:155px; margin-top:5px; width:610px; font-size:12px; text-align:right;">{$list.preis}<br /><small>{$mwst_versand}</small></div>
<div style="z-index:5; position:absolute; margin-left:148px; margin-top:85px; width:619px; height:40px; background-color:#eaeaea;"></div>
<div style="z-index:6; position:absolute; margin-left:160px; margin-top:50px; width:605px; font-size:12px; text-align:right;">{$list.lieferstatus_angabe}</div>
<div style="z-index:7; position:absolute; margin-left:155px; margin-top:95px; width:605px; font-size:12px; text-align:right;">{$list.merkliste} {$list.button_details} {$list.kaufbutton}</div>
<div style="z-index:8; position:absolute; margin-left:160px; margin-top:100px; width:auto; font-size:10px; text-align:left;">{$list.lagerbestand}</div>
<div style="z-index:9; position:absolute; margin-left:155px; margin-top:35px; width:475px; height:37px; overflow:hidden; font-size:10px; text-align:left;">{$list.kurzbeschreibung}</div>
<div style="clear:both;"></div>
</div>

Gruß
 
Den Codesnippet kann ich jetzt nicht direkt überprüfen, da mir hier IE8 nicht zur Verfügung steht, aber deine einzelnen Inline-Styles (style-Attribute) sind doch sicher in einer CSS-Datei hinterlegt, wo es dann u.a. heißt:

CSS: 
#1 { ... } 

/* oder */
div#1 {  ... }

Solch ein ID-Bezeichner darf aber nicht mit einer Ziffer beginnen, und führte aus diesem Grund schon so manches mal zu Fehldarstellungen in den Browsern.

Möglicherweise ist dies der Grund, dass IE8 in der Kompatibilitätsansicht dein CSS mißinterpretiert.

Und weiter, wie lautet deine Doctype-Deklaration für das Dokument (vor <html>)? Schalten mit ihr die Browser in den standardkonformen Darstellungsmodus ("Almost Standards Mode")?

Wenn nein, befinden sie sich im "Quirks Mode", womit IE8 der offiziellen CSS-Spezifikation nicht korrekt folgt.
 
Zuletzt bearbeitet:
Darf ich mal vorsichtig raten? Kann es sein das du keinen DOCTYPE in der Seite verwendest? Meine erste Seite mit DIV usw. waren im IE auch eine absolute Katastrophe und ich habe viele Stunden damit zugebracht den Fehler zu finden. Dann kam eine gute Freundin und meinte ich habe kein DOCTYPE angegeben. Ich muss gestehen ich habe das vorher nicht einmal gekannt. Die Zeile in die Seite eingefügt und es ging.
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück