Skip to content

Support for relational pseudo-class :has() #66

Open
@redapple

Description

@redapple

CSS Selectors Level 4 (still in draft) introduce the :has() pseudo-class:

The relational pseudo-class, :has(), is a functional pseudo-class taking a relative selector list as an argument. It represents an element if any of the relative selectors, when absolutized and evaluated with the element as the :scope elements, would match at least one element.

For example, the following selector matches only <a> elements that contain an <img> child:
a:has(> img)
The following selector matches a <dt> element immediately followed by another <dt> element:
dt:has(+ dt)

Although no browser seems to be supporting this yet, it looks here to stay (I may be wrong).

It would be interesting to support this to get a bit more flexibility on predicates (e.g. testing children elements).

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions