Außenabstand

Unsere Karten kleben aneinander. Der Platz zwischen Elementen entsteht durch den Außenabstand (margin): den Platz außerhalb des Rahmens, wie der Abstand zwischen zwei Bildern an einer Wand.

margin: 20px;

Genau wie der Innenabstand lässt sich der Außenabstand auf allen Seiten gleichzeitig festlegen oder auf jeder Seite einzeln mit margin-top, margin-right, margin-bottom und margin-left.

Was ist der Unterschied zwischen Innen- und Außenabstand? Der Innenabstand liegt innerhalb des Rahmens, und der Hintergrund des Elements füllt ihn aus. Der Außenabstand liegt außerhalb des Rahmens und ist immer transparent: Du siehst durch ihn den Hintergrund des Elternelements.

Browser geben manchen Elementen auch standardmäßig einen Außenabstand. Überschriften und Absätze haben oben und unten einen Außenabstand, deshalb gibt es Lücken zwischen ihnen, obwohl wir keine festgelegt haben. Das Element body hat auf jeder Seite 8 Pixel Außenabstand, und deshalb reicht die grüne Fläche mit der Überschrift nicht bis an die Ränder der Vorschau.

Wenn ein Wert null ist, kannst du die Einheit weglassen: margin: 0 ist null in jeder Einheit.