CSS padding – Innenabstand

Einleitung

Mit der CSS Eigenschaft padding wird angegeben, wieviel Abstand in einem Element gesetzt werden soll. Es kann auf Inline- und Blockelemente angewandt werden.

Jedes Element besitzt 4 Seiten. Die Abstände können einzeln, gruppiert oder insgesammt gesetzt werden. Die padding-Eigenschaft besitzt 4 eigene Eigenschaften.

• padding – gibt an, dass alle 4 Seiten eines Elements eingestellt werden sollen
• padding-top – gibt an, dass der Abstand von der Oberseite aus eingestellt wird
• padding-right – gibt an, dass der Abstand von der rechten Seite eingestellt wird
• padding-bottom – gibt an, dass der Abstand von unten eingestellt wird
• padding-left – gibt an, dass der Abstand von links eingestellt wird

Eigenschaft: padding

CSS-Beispiel Code für padding

div{ padding: 8px 15px; }

Beispiel erläutert:

Es werden 2 Werte dem padding übergeben. Der erste, 8px (px steht für Pixel), stellt oben und unten (sozusagen top und bottom) ein. Der zweite Wert gibt links und rechts an. Für das Beispiel wurden 15px gewählt. Aneinandergereite Werte sind durch ein Leerzeichen zu trennen. Bei einer 0 wird keine Einheit benötigt (Beispiel: anstatt 0px reicht eine einfache 0 ).

Nur bei padding sind maximal 4 Wertangaben möglich:

• EIN Wert – alle 4 Seiten
• ZWEI Werte – 1. oben und unten, 2. rechts und links
• DREI Werte – 1. oben und unten, 2. rechts, 3. links
• VIER Werte – 1. oben, 2. rechts, 3. unten, 4. links

Eigenschaften: padding-top, padding-right, padding-bottom, padding-left

Diese Eigenschaften bestimmen immer nur den einen angegebenen Innenabstand. Es ist nur ein Wert übergebbar.

Informationen und Werte

Vererbbar: Nein
Initialwert: 0
Werte: Prozentangaben, Längenangaben, Inherit (inherit), Automatisch (auto)