[CSS] Problem mit relativer Breite

[alcaeus]

Ja, ich hatte heute wieder mal einen WTF-Moment.

Ich habe ein div, welches 50% breit und zentriert ist. Das div hat ein Padding von 1em auf allen Seiten, und einen roten Hintergrund.
Eingebettet in dieses div liegt ein weiteres, welches 100% der Breite hat, und wiederum ein padding von 1em, sowie einen gruenen Hintergrund.

Jeder der sich ein bisschen mit HTML/CSS auskennt, weiss was man dann eigentlich erwarten wuerde.

Vorgestellt?

Eingepraegt?

Ja, dann guckt euch das an: http://files.alcaeus.org/ihatecss.html
Das Ding sieht uebrigens im IE und Firefox exakt identisch aus; da sind keine Float-Spielereien drin, nichts besonderes, und die Seite ist auch komplett XHTML 1.1 valide.

Ok, nachdem ich ja nicht laestern sondern fragen will: hatte jemand schon so ein Problem, und weiss wie man es umgehen kann? BTW, die beiden verschachtelten Boxen sind momentan nur deshalb so da, weil ich die zweite Box, die darin liegen soll ausgeblendet habe, um das mit der Breite zu testen. Warum wird die Breite des Elternelements inklusive Padding genommen, und nicht wie man erwartet ohne?

Greetz
alcaeus