Do these 3 things before closing this tab:
1Repair Windows errors before they cause bigger problems2Fix the driver behind crashes, sound loss and screen glitches3Clear out junk files and repair common Windows errorsCSS :last-child matches an element only when it is the final child in its parent’s sibling list. It does not mean “the last element with this tag.” If later siblings of other types are present, use :last-of-type instead.
What does :last-child select?
:last-child is a structural pseudo-class that matches an element when it is the last child of its parent. The selector can be combined with a type selector, class, ID, combinator, or other pseudo-classes.
li:last-child {
border-bottom: 0;
}This rule matches an <li> only if that list item is the final child in its parent. If a different element follows it, the rule does not match. See MDN’s :last-child reference.
Why might :last-child not work?
The most common cause is that the target is not actually the last child. For example:
#1 Best Overall
- HTML CSS Design and Build Web Sites
- Comes with secure packaging
- It can be a gift option
<div>
<p>One</p>
<p>Two</p>
<span>Note</span>
</div>Neither paragraph matches :last-child, because the <span> is the final child. The second paragraph is the last paragraph, however, so p:last-of-type matches it.
Check the element’s actual parent and all of that parent’s child elements. If scripts or a framework insert elements, inspect the rendered DOM rather than relying only on the original HTML. A selector such as .nav > li:last-child also requires an li that is a direct child of an element with the nav class.
:last-child vs. :last-of-type
| Selector | Which siblings count? | Effect of a later different element type | Use it when |
|---|---|---|---|
:last-child |
All child elements | It prevents an earlier target from matching. | The target must be the final child, regardless of type. |
:last-of-type |
Only siblings of the target’s element type | It does not prevent the final sibling of that type from matching. The Wiley CSS reference describes it as selecting the last element “of a particular type.” | You want the final element of a type even if another type follows. |
In the example with two paragraphs followed by a span, p:last-child matches neither paragraph; p:last-of-type matches the second. Choose based on which sibling group matters, not just on which selector seems more likely to match.
Useful :last-child examples
Remove a divider from the final navigation item
.nav > li:last-child {
border-bottom: 0;
}Remove bottom spacing from the final card paragraph
.card > p:last-child {
margin-bottom: 0;
}This matches only when the final child of the card is a paragraph. If a different element follows the paragraph, use .card > p:last-of-type when the intent is to style the last paragraph instead.
Rank #3
- Brand: Wiley
- Set of 2 Volumes
- A handy two-book set that uniquely combines related technologies Highly visual format and accessible language makes these books highly effective learning tools Perfect for beginning web designers and front-end developers
Browser support and standards behavior
Can I Use reports 97.27% global usage support for :last-child in its August 2026 compatibility dataset. Its table lists support in current Chrome, Edge, Firefox, Safari, Opera, and iOS Safari releases. Very old browsers and obsolete embedded engines may require a fallback if they are part of your supported audience. See Can I Use’s CSS selector support data.
Selectors Level 4 permits :last-child to match an element with no parent; earlier definitions required a parent. That edge case rarely affects ordinary HTML, where the relevant sibling group is normally inside a parent. The standards behavior is documented in the Selectors Level 4 specification and noted in the earlier Selectors Level 3 specification.
For a single final-child selection, :last-child is clearer than :nth-last-child(1), which expresses the same position numerically.
Quick Recap
Best Value
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.
