Reputation: 1542
I want to apply a particular style for child div from 4 to n-1 .i was able to do from 4 to n , but could not exclude the last div
here is the jsfiddle http://jsfiddle.net/8WLXX/
.container div:nth-child(n+4) { background: red; }
All I want is exclude last div also.
Upvotes: 5
Views: 5488
Reputation: 9348
For future readers:
.nth-test div:nth-child(n+4):nth-last-child(n+2) {
background: red;
}
<div class="nth-test">
<div>foo</div>
<div>foo</div>
<div>foo</div>
<div>foo</div>
<div>foo</div>
<div>foo</div>
<div>foo</div>
<div>foo</div>
</div>
Upvotes: 0
Reputation: 15779
You can also do it by using .container div:nth-child(n+4):last-child
For Instance,
.container div:nth-child(n+4):last-child{
background:none;
}
Hope this helps.
Upvotes: 0
Reputation: 73976
You can do this:
.container div:nth-child(n+4):not(:last-child) {
background: red;
}
Upvotes: 5
Reputation: 437904
Simply add :not(:last-child)
to the selector:
.container div:nth-child(n+4):not(:last-child)
Upvotes: 3