Why is last-child not targeting the last article tag in this fiddle?

Question

<div class="parent">
<article class="example">111</article>
<article class="example">111</article>
<article class="example">111</article>
<article class="example">111</article>
<section>content</section>
</div>

CSS

.parent .example{ background-color: red;}
.parent .example:last-child{background-color: yellow;}

score 14 · Accepted Answer · answered Jan 18 '13 at 21:33

14

last-child targets, well, the last child of the parent. In this case, the last child is a section which doesn't have the class example, and consequently nothing matches the selector.

What you're looking for is last-of-type, which matches elements and not classes. Take a look.

answered Jan 18 '13 at 21:33

jamesplease

12,547
6
47
73

grumble .. it doesn't work with ie8 ... do you know any other way other than JS? – byronyasgur Jan 18 '13 at 21:37
scratch that ... last-child wouldnt have worked with IE8 anyway :-O – byronyasgur Jan 18 '13 at 21:39

score 0 · Answer 2 · answered Jan 18 '13 at 21:34

0

Because the selector says "last child of each of articles"

answered Jan 18 '13 at 21:34

Moseleyi

2,585
1
24
46

How do it get it to target the last article? ie not section – byronyasgur Jan 18 '13 at 21:35

Why is last-child not targeting the last article tag in this fiddle?

2 Answers2