Nochmal hallo,
nein, ich will nicht drängeln, aber vielleicht war das Thema etwas mißverständlich formuliert, darum versuche ich, mein Problem noch einmal etwas kürzer auszudrücken:
Ich habe zwei DIVs:
<body>
<div id="box1">sdfa afasf adf</div>
<div id="box2">sdfa afasf adf</div>
</body>
die folgendermaßen formatiert sind:
#box1 {
float:left;
text-align:left;
font: normal 0.93em Helvetica,Tahoma,Arial,sans-serif;
color:black; background:#fdcc8e;
width:9em;
margin:1em 0 0 0;
padding:0;
border:0;
}
#box2 {
text-align:left;
font: normal 0.93em Helvetica,Tahoma,Arial,sans-serif;
color:black; background:#fdcc8e;
margin:1em 0 0 10.5em;
padding:0;
border:0;
}
so daß #box1 links von #box2 liegt, #box1 eine feste Breite in em hat und #box2 den verbleibenden zur Verfügung stehenden horizontalen Raum ausfüllt.
Beide DIVs sollen vom oberen Rand des übergerodneten Elementes (hier der body), den gleichen Abstand haben, realisiert durch margin-top:1em.
Das Problem:
In Firefox 1.5 und Opera 8.5 klappt alles wie gewünscht, im IE6 ist die vertikale Position der DIVs unterschiedlich, trotz gleicher Formatierung.
Nur, wenn margin-top:0 gesetzt ist, ist die Darstellung in allen der genannten Browser korrekt.
HTML (XHTML 1.0 Strict) und CSS sind valide, was mache ich falsch?
Danke
Roland