Na ja, letztlich Geschmackssache. Ein padding-top für #wrapper würde es genauso tun, wie ein margin-top für das erste .box-Element. Ich persönlich "platziere" Elemente gerne direkt - aber ich bin ja auch nur .NET-Entwickler

Gruß, lotti.

__________________
Empfehlenswerte Links:
jsFiddle | JavaScript Patterns | RedBeanPHP | Mozilla Developer Network -/- W3C Validator | JSLint

Eben.

Grundsätzlich ist margin-top für das erste Kind nicht immer sinnvoll, denn dabei stolpert man schnell über eine unerwünschte Auswirkung von Collapsing Margins, sofern weder das Eltern- noch das Kindelement einen neuen Block Formatting Context erzeugen, und das Elternelement z.B. weder padding-top noch border-top hat.

Denn dann führt margin-top des ersten Kindes nicht dazu, dass es einen Abstand zur Oberkante des Elternelementes bekommt, sondern das Elternelement rutscht nach unten (um den Wert von margin-top des Kindes), und das Kind klebt immer noch direkt an der Oberkante des Elternelementes.

(Bei den hier gezeigten Lösungen tritt dieses Verhalten allerdings nicht auf.)

__________________
Wer keinen Link auf seine problembehaftete Seite posten kann, weil diese noch nicht online ist: Testcase bauen, online stellen, Link posten.
Internet-Grundregel: Unbekannte Begriffe googeln! (Erspart 99% aller Nachfragen.)

Hallo,

vielen Dank für diese Information! Das war mir so nicht bewusst. Ich habe hier auch zwei recht nette Artikel zu dem Thema gefunden:

- The Styleworks - Collapsing Margins
- Researchkitchen - Auto-height and margin-collapsing

Gruß, lotti.

__________________
Empfehlenswerte Links:
jsFiddle | JavaScript Patterns | RedBeanPHP | Mozilla Developer Network -/- W3C Validator | JSLint