:last-child CSS Pseudo Class

Description

The :last-child pseudo-class sets the style of the last element in the group of sibling elements (having one parent).

Syntax

element:last-child { … }

Example

<div>
<p>Example of the :last-child pseudo class</p>
<ul>
<li>First List Item</li>
<li>Second List Item</li>
<li>Third List Item</li>
<li>Fourth and Last List Item</li>
</ul>
<p>This paragraph is also the last child element.</p>
</div>
li:last-child {
color: purple;
font-weight: bold;
}
p:last-child {
color: #06bca7;
font-weight: bold;
}

Browser Support

Desktop
Explorer Edge Chrome Firefox Opera Safari
912119.53.2
Tablets / Mobile
Android Chrome Firefox Opera Safari Samsung
≤3718410.13.2Yes