:last-child and :not pseudo classes together
I have a bunch of list items inside my
<ul>
all of which have class of "level0 level-top parent". However, the last 2 list items have an additional class called "mobile-nav-only" as well as "level0 level-top parent"
I want to add some CSS to the very last <li>
with the class of "level0 level-top parent" BUT ONLY if that li does NOT have "mobile-nav-only". I believe I need to combine both :last-child and :not pseudo classes but I'm struggling to figure out the correct syntax.
Any help appreciated, thank you 🙂
P.S. I cannot change the markup or add additional CSS classes5 Replies
I think I see what you mean, but can you make a minimal reproduction of what you have. A codepen would be ideal (https://pen.new)
You can use this if you don't mind relatively mediocre support:
https://caniuse.com/css-nth-child-of
If you want a bit better support you can do this instead:
Tho if you ever have another .level0 followed by a .mobile-nav-only it will be matched too
Thanks, both solutions work, I will play around with them and see which ones fits my needs better.