Form validity pseudo-classes

The form validity CSS pseudo-classes match <form> elements based on the constraints of a form field, such as validity (:valid, :invalid, :in-range, :out-of-range) and necessity (:optional or :required).

Learning resources on MDN

• :valid
• :invalid
• :in-range
• :out-of-range
• :optional
• :required

Browser support (view on caniuse.com)

• Chrome 10 Released on 2011-03-08
• Chrome Android 18 Released on 2012-06-27
• Edge 12 Released on 2015-07-29
• Firefox 4 Released on 2011-03-22
• Firefox for Android 4 Released on 2011-03-29
• Safari 5 Released on 2010-06-07
• Safari on iOS 5 Released on 2011-10-12

Edit this feature - Report an issue about this feature