Der Innenabstand
Der Innenabstand (padding) ist ein Teil der content-box. Man kann ihn sich wie eine Polsterung um den Inhalt vorstellen. Wenn kein Innenabstand angegeben ist, ist die Kante des Innenabstands identisch mit der Außenkante des Inhalts.
Ohne Innenabstand
Ergebnis
Dieser Text ist ohne Angabe eines Innenabstands formatiert.
p { border: 2px solid magenta; }Mit padding: 30px
Ergebnis
Dieser Text ist mit einem Innenabstand von padding: 30px zum Rahmen formatiert.
p { border: 2px solid magenta;
padding: 30px; }Mit padding-left: 100px
Ergebnis
Dieser Text ist mit einem linken Innenabstand von padding-left: 100px zum Rahmen formatiert.
p { border: 2px solid magenta;
padding-left: 100px; }