- From: alexnozer via GitHub <sysbot+gh@w3.org>
- Date: Thu, 27 Mar 2025 16:09:10 +0000
- To: public-css-archive@w3.org
I find this suggestion useful. Currently, we have the `:valid`/`:invalid` and `:user-valid`/`:user-invalid` selectors. However, they are too generic and only indicate whether the value is valid or invalid, without providing further details. There are also `:in-range`/`:out-of-range` selectors, which specify whether the value falls within the defined range. However, there are no corresponding selectors for the `pattern`, `minlength`/`maxlength`, `type` and other attributes. It would be useful to introduce new selectors for a one-to-one correspondence with the `ValidityState` properties. A set of selectors might look as follows (presented in the table): | HTML attribute | `ValididtyState` | CSS invalid selector | CSS valid selector | |-|-|-|-| | `required` | `valueMissing` | `:value-missing` | `:value-exists` | | `min` | `rangeUnderflow` | `:range-underflow` and also match current `:out-of-range` | `:in-range` | | `max` | `rangeOverflow` | `:range-overflow` and also match current `:out-of-range` | `:in-range` | | `minlength` | `tooShort` | `:too-short` | `:optimal-length` | | `maxlength` | `tooLong` | `:too-long` | `:optimal-length` | | `type` | `typeMismatch` | `:type-mismatch` | `:type-match` | | `step` | `stepMismatch` | `:step-mismatch` | `:step-match` | | `pattern` | `patternMismatch` | `:pattern-mismatch` | `:pattern-match` | A combination of the `:not()` pseudo-class and CSS invalid selectors can be used as an alternative to CSS valid selectors (e.g., `:not(:pattern-mismatch)` instead of `:pattern-match`). A set of these selectors would enable the addition of hidden error messages that can be displayed without the need for JavaScript. This approach can be useful for basic form validation. -- GitHub Notification of comment by alexnozer Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/1525#issuecomment-2758602362 using your GitHub account -- Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config
Received on Thursday, 27 March 2025 16:09:12 UTC