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

castastrophe has just created a new issue for https://github.com/w3c/csswg-drafts:

== [selectors] :visible pseudo-class for targeting only visible elements ==

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