Startseite >CSS >CSS-Referenz – Eigenschaften, Selektoren, Funktionen >:last-child

:last-child

Selektor:last-child

Wählt ein Element, das unter den Kindern seines Elternelements das letzte ist. Sie eignet sich, um den unteren Abstand oder die Linie beim letzten Element in einem Kasten zu entfernen, damit kein unnötiger Leerraum entsteht. Spezifität 0-1-0.

Beispiele

Die Absätze im Kasten haben einen unteren Abstand, der letzte nicht – unter dem Text entsteht kein zusätzlicher Leerraum:

<div class="box">
  <p>Der erste Absatz.</p>
  <p>Der letzte Absatz.</p>
</div>

.box {
  max-width: 260px;
  padding: 10px 12px;
  background: #e3f2fd;
}
.box p { margin: 0 0 12px; }
.box p:last-child { margin-bottom: 0; }
Ergebnis

Der erste Absatz.

Der letzte Absatz.

Worauf Sie achten sollten

  • Die Regel greift nicht mehr, sobald nach dem Element noch etwas anderes steht – ein verstecktes Element, ein <script> oder ein Element, das ein CMS oder ein Werbeskript einfügt. Auch ein Element mit display: none zählt.
  • Genau wie bei :first-child wird der Elementtyp erst danach geprüft: p:last-child wählt nicht den letzten Absatz, wenn ihm zum Beispiel ein Bild folgt. Den letzten Absatz wählt p:last-of-type.
  • Den unteren Abstand des letzten Absatzes kann man oft auch lösen, indem der Kasten keinen unteren Innenabstand bekommt, oder über Lücken mit gap.

Browserunterstützung

Baseline – weithin verfügbar: funktioniert in allen gängigen Browsern, und das schon lange (spätestens seit 2015). Ab Version: Chrome 1, Firefox 1, Safari 3.1. Stand: Oktober 2026 (MDN browser-compat-data).

Siehe auch:
:first-child
:first-of-type und :last-of-type
:nth-last-child()
:only-child
margin