Is it possible? If not, is there a way to do it with jQuery?
Definition and UsageThe :nth-child(n) selector matches every element that is the nth child of its parent. n can be a number, a keyword (odd or even), or a formula (like an + b). Tip: Look at the :nth-of-type() selector to select the element that is the nth child, of the same type (tag name), of its parent.
When designing and developing web applications, sometimes we need to select all the child elements of an element except the last element. To select all the children of an element except the last child, use :not and :last-child pseudo classes.
It is possible with CSS3. Consider the markup:
<ul> <li><a href="">First item</a></li> <li>Second item</li> <li><a href="">Test</a></li> <li><a href="">Test</a></li> <li><a href="">Pre-last item</a></li> <li><a href="">Last item</a></li> </ul>
To choose the last two LI elements you do:
ul > li:nth-last-of-type(-n+2) { background: green; }
Works in all contemporary browsers including IE9, but excluding IE8 and below. To add support for those browsers, you might consider using Selectivizr.js
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With