Combining :last-child with :not(.class) selector in CSS

by

Not with CSS selectors alone, no, as :last-child specifically looks at the last child, and there isn’t a similar :last-of-class pseudo-class. See my answer to this related question.

As of late 2015, implementations have begun slowly trickling in for Selectors 4’s extension to :nth-child() and :nth-last-child() which allow you to pass an arbitrary selector as an argument (more on that also in an update to the linked answer). You will then be able to write the following:

tr:nth-last-child(1 of :not(.table_vert_controls))

Although implementations have recently begun to ship, it will still take at least a few more years for this to be widely supported (as of April 2018, two and a half years after being the first browser to ship, Safari remains the only browser to have done so). In the meantime, you’ll have to use something else, like an extra class just before the class in question, or a jQuery selector:

$('tr:not(.table_vert_controls):last')

More Related Contents:

  1. Is there a CSS parent selector?
  2. What do commas and spaces in multiple classes mean in CSS?
  3. Complex CSS selector for parent of active child [duplicate]
  4. Select every Nth element in CSS
  5. CSS3 selector :first-of-type with class name?
  6. CSS Selector that applies to elements with two classes
  7. Why isn’t it possible to combine vendor-specific pseudo-elements/classes into one rule set?
  8. CSS ‘>’ selector; what is it? [duplicate]
  9. CSS selector based on element text? [duplicate]
  10. Should I avoid using !important in CSS?
  11. CSS: How to say .class:last-of-type [classes, not elements!] [duplicate]
  12. Pure CSS checkbox image replacement
  13. Handling a colon in an element ID in a CSS selector [duplicate]
  14. How to write a CSS hack for IE 11? [duplicate]
  15. :not() selector not behaving the same between Safari and Chrome/Firefox
  16. CSS selector for attribute names based on a wildcard
  17. Invalid CSS selector causes rule to be dropped: What is the rationale?
  18. Style child element when hover on parent
  19. How to select the first, second, or third element with a given class name?
  20. Combine :after with :hover
  21. What does the dot mean in CSS?
  22. Should I use CSS :disabled pseudo-class or [disabled] attribute selector or is it a matter of opinion?
  23. :active css selector not working for IE8 and IE9
  24. Is there such a thing as an “all inclusive sibling” CSS selector?
  25. CSS selector involving pseudo class first-child and dropcap
  26. Multiple descendant children selector with css [duplicate]
  27. Targeting position:sticky elements that are currently in a ‘stuck’ state
  28. Select odd even child excluding the hidden child
  29. What is the difference between pseudo-classes and pseudo-elements?
  30. Shorten verbose CSS that repeats combinations of elements and pseudo-classes

Leave a Comment