W3C home > Mailing lists > Public > public-css-archive@w3.org > December 2020

[csswg-drafts] [selectors] :visible pseudo-class for targeting only visible elements (#5827)

From: [ Cassondra ] via GitHub <sysbot+gh@w3.org>
Date: Tue, 29 Dec 2020 14:33:40 +0000
To: public-css-archive@w3.org
Message-ID: <issues.opened-775922936-1609252419-sysbot+gh@w3.org>
castastrophe has just created a new issue for https://github.com/w3c/csswg-drafts:

== [selectors] :visible pseudo-class for targeting only visible elements ==
https://www.w3.org/TR/selectors-4/

Proposal to add a `:visible` pseudo-class to the selectors specification.  This would allow authors to target only elements in the DOM that do not have `display: none` or `visibility: hidden` applied.  Would be helpful if it also excluded `style` and `script` tags that do not render visible user content.  This would add a lot of value for systems builders as often they do not have full control of the markup they are styling.

## Example use-cases

- `li:visible`: Target all visible list items.
- `*:first-child:visible`: Target the first visible element (this is extremely useful for situations where a script or style tag might appear first in the DOM but is not visible to the user).
- `div:not(:visible)`: A way to toggle visibility (though some JS or interaction would likely be involved to trigger the change).


Apologies if this has already been discussed, I did a search of the issue queue and did not see anything comparable.  I look forward to discussion on this!


Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/5827 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config
Received on Tuesday, 29 December 2020 14:33:42 UTC

This archive was generated by hypermail 2.4.0 : Tuesday, 5 July 2022 06:42:24 UTC