CSS-Eigenschaft padding-left

Die CSS-Eigenschaft padding-left stellt den Padding-Bereich auf der linken Seite eines Elements ein.

Negative Werte sind nicht gültig.

Diese Eigenschaft hat keinen Einfluss auf Inline-Elemente, wie das Tag <span>.

Anfangswert	0
Gilt für	Alle Elements, außer wenn die Eigenschaft display auf table-row-group, table-header-group, table-footer-group, table-row, table-column-group und table-column eingestellt ist. Das gilt auch für ::first-letter.
Geerbt	Nein
Animierbar	Ja, der Polsterbereich ist animierbar.
Version	CSS1
DOM Syntax	object.style.paddingLeft = "40px";

Syntax

padding-left: length | initial | inherit;

Beispiel

<!DOCTYPE html>
<html>
  <head>
    <title>Der Titel des Dokuments</title>
    <style>
      p {
      border: 2px solid #000; 
      color: #1c87c9;
      padding-left: 100px;
      }
    </style>
  </head>
  <body>
    <h2>Beispiel für die Eigenschaft padding-left</h2>
    <p>Lorem Ipsum ist ein Blindtext der Druck- und Satzindustrie.</p>
  </body>
</html>

Versuch es selber!

Ein weiteres Beispiel, wo der Polsterbereich auf "2cm" eingestellt ist:

Beispiel

<!DOCTYPE html>
<html>
  <head>
    <title>Der Titel des Dokuments</title>
    <style>
      p {
      border: 2px solid #000; 
      color: #1c87c9;
      padding-left: 3cm;
      }
    </style>
  </head>
  <body>
    <h2>Beispiel für die Eigenschaft padding-left</h2>
    <p>Lorem Ipsum ist ein Blindtext der Druck- und Satzindustrie.</p>
  </body>
</html>

Versuch es selber!

Werte

Wert	Beschreibung
length	Es stellt die linke Polsterung in px, pt, cm usw. ein. Der Standardwert ist 0px.
%	Stellt die linke Polsterung in Prozent der Breite des enthaltenden Elements ein.
initial	Der Wert stellt die Eigenschaft auf seinen Standardwert ein.
inherit	Der Wert erbt die Eigenschaft von seinem übergeordneten Element.