In CSS (any version), is there something like, or any other way of doing anything like the :has()
selector in jQuery?
jQuery(':has(selector)')
Description: Selects elements which contain at least one element that matches the specified selector.
Join Stack Overflow to learn, share knowledge, and build your career.
In CSS (any version), is there something like, or any other way of doing anything like the :has()
selector in jQuery?
jQuery(':has(selector)')
Description: Selects elements which contain at least one element that matches the specified selector.
No, there isn't. The way CSS is designed, does not permit selectors that match ancestors or preceding siblings; only descendants ( and
>
), succeeding siblings (~
and +
) or specific children (:*-child
). The only ancestor selector is the :root
pseudo-class which selects the root element of a document (in HTML pages, naturally it would be html
).
If you need to apply styles to the element you're querying with :has()
, you need to add a CSS class to it then style by that class, as suggested by Stargazer712.
:has()
selector, would work just as well in this case if it gets standardized and implemented.
– BoltClock♦
Jan 4 '12 at 22:49
No. The best way to accomplish this is by using jQuery:
Css File:
.myAwesomeClass {
...
}
Js File:
jQuery(':has(selector)').addClass("myAwesomeClass")
where selector
is whatever it is you were originally trying to match.
:has()
is a conditional pseudo-class, similar to:not()
. The elements matched are the selectors around the pseudo-class, not in the brackets. – BoltClock♦ Jun 8 '11 at 12:53