I have a list of sub-lists. Each sublist has its own children. I need to apply style to all except the last sub-list. I use:
.list:not(:last-child) > .sublist {
color: red;
}
But it is applying for all the sublists. Here's a demonstrating code (fiddle: http://jsfiddle.net/8m72m53r/3/):
:not(:last-child) > .row {
color: red;
}
<ul class="box">
<li class="row">One</li>
<li class="row">Two</li>
<li class="row">Three</li>
</ul>
<ul class="box">
<li class="row">FOur</li>
<li class="row">Five</li>
<li class="row">Six</li>
</ul>
<ul class="box">
<li class="row">Seven</li>
<li class="row">Eight</li>
<li class="row">Nine</li>
</ul>
Here you go - you pretty much had it, just make sure to use the :last-of-type pseudoclass
.box:not(:last-of-type) > .row {
color: red;
}
<ul class="box">
<li class="row">One</li>
<li class="row">Two</li>
<li class="row">Three</li>
</ul>
<ul class="box">
<li class="row">FOur</li>
<li class="row">Five</li>
<li class="row">Six</li>
</ul>
<ul class="box">
<li class="row">Seven</li>
<li class="row">Eight</li>
<li class="row">Nine</li>
</ul>