:nth-last-child(N) (CSS selector)

Spec
Version
CSS3
Browser support (more…)
IE8 FF3.5+ SA3.1+ OP9.5+ CH2+
None Full Full Full Full

Syntax

:nth-last-child( { number expression | odd | even } ) {
declaration block
}

Description

This pseudo-class matches elements on the basis of their positions within a parent element’s list of child elements. The pseudo-class accepts an argument, N, which can be a keyword, a number, or a number expression of the form an+b. For more information, see Understanding :nth-child Pseudo-class Expressions.

If N is a number or a number expression, :nth-last-child(N) matches elements that are followed by N-1 siblings in the document tree.

This example selector will match the last four list items in any list, be it ordered or unordered:

li:nth-last-child(-n+4) {
  ⋮ declarations
}

This selector will match any paragraph that’s the last child element of its parent element:

p:nth-last-child(1) {
  ⋮ declarations
}

This is, of course, equivalent to the selector p:last-child.

Example

This example selector will match the last row of any table:

tr:nth-last-child(1) {
  ⋮ declarations
}

Compatibility

Internet Explorer Firefox Safari Opera Chrome
5.5 6.0 7.0 8.0 1.0 1.5 2.0 3.0 3.5 1.3 2.0 3.1 4.0 9.2 9.5 10.0 2.0
None None None None None None None None Full None None Full Full None Full Full Full

This pesudo-class is currently not supported in Internet Explorer.

User-contributed notes

There are no comments yet.

Related Products