CSS :valid pseudo-class

Definition and usage

CSS :valid Pseudo-classes are used to set the style of valid form elements.

Tip:Use :invalid Selector sets the style of invalid form elements.

Example

Select and set the style of a valid <input> element:

input:valid {
  background-color: beige;
  border: 2px solid green;
}

Try it yourself

CSS syntax

:valid {
  css declarations;
}

Technical details

Version: CSS4

Browser support

The numbers in the table indicate the first browser version that fully supports this pseudo-class.

Chrome Edge Firefox Safari Opera
10 12 4 5 10

Relevant pages

Referentie:CSS :invalid pseudoklasse