Want to share your CSS expertise with others? Apply to the MDN Fellowship by April 1! http://mzl.la/MDNFellowship

mozilla

Revision 40999 of :last-child

  • Revision slug: CSS/:last-child
  • Revision title: :last-child
  • Revision id: 40999
  • Created:
  • Creator: teoli
  • Is current revision? No
  • Comment linkification + better wording; 1 words added, 1 words removed

Revision Content

{{ CSSRef() }}

Summary

The :last-child pseudo-class represents any element that is the last child element of its parent.

Syntax

element:last-child { style properties }

  

Examples

span:last-child
{
    background-color: lime;
}

...where...

  <div>
    <span>This span is not limed.</span>
    <span>This span is! :)</span>
  </div>

... should look like ...
This span is not limed. This span is! :)

Notes

{{ languages( { "fr": "fr/CSS/:last-child", "pl": "pl/CSS/:last-child" } ) }}

Revision Source

<p>{{ CSSRef() }}</p>
<h3 name="Summary">Summary</h3>
<p>The <code>:last-child</code> <a href="/en/CSS/Pseudo-classes" title="Pseudo-classes">pseudo-class</a> represents any element that is the last child element of its parent.</p><h3 name="Syntax">Syntax</h3>
<pre class="eval">element:last-child { <em>style properties</em> }
</pre>
<p>  </p>
<h3 name="Examples">Examples</h3>
<pre class="brush: css">span:last-child
{
    background-color: lime;
}
</pre>
<p>...where...</p>
<pre class="brush: html">  &lt;div&gt;
    &lt;span&gt;This span is not limed.&lt;/span&gt;
    &lt;span&gt;This span is! :)&lt;/span&gt;
  &lt;/div&gt;
</pre>
<p>... should look like ... <br>
<span>This span is not limed.</span> <span style="background-color: lime;">This span is! :)</span></p>
<h3 name="Notes">Notes</h3>
<p>{{ languages( { "fr": "fr/CSS/:last-child", "pl": "pl/CSS/:last-child" } ) }}</p>
Revert to this revision