Verständnisproblem bei verschachtelten DIV mit margin/padding

[ChrisB]

Hi,

Mein Problem ist folgendes: Ich habe zwei verschachtelte Divs. Ins äussere lege ich ein Backgroundbild, dem Inneren gebe ich rundrum ein margin, um das innere div 20px nach innen zu schieben.

Wenn ich den Code nun wie hier schreibe, wird mir das backgroundbild des äusseren div (#header) 20px nach unten geschoben, wie wenn ich diesem Div ein padding gegeben hätte.

Ich vermute, dass eher dieses aeussere Div selbst um 20px nach unten verschoben wird. (Hast du das mal bspw. mittels FireBug ueberprueft?)

Beschaeftige dich mit collapsing margins:
"The top margin of an in-flow block-level element is adjoining to its first in-flow block-level child's top margin if the element has no top border, no top padding, and the child has no clearance."

Die Grösse des Divs stimmt nur das Backgroundbild wird verschoben und auch nur nach unten, lusterweise nicht nach rechts, dort hätte das innerdiv ja auch ein margin von 20px.

Fuer die seitlichen margins ist ja auch nichts entsprechendes im Standard definiert.

Wenn ich dem #header-inner anstatt margin ein padding mit denselben Werten gebe funzt alles richtig. Und... wenn ich dem #header einen border gebe stellt er das backgroundbild auch an die richtige Position.

Na siehste - siehe oben.

MfG ChrisB