CSS3 :valid Selector


Example

Select and style only if the value of the <input> element is valid:

input:valid {
    background-color: yellow;
}

Try it yourself »

Definition and Usage

The :valid selector selects form elements with a value that validates according to the element's settings.

Note: The :valid selector only works for form elements with limitations, such as input elements with min and max attributes, email fields with a legal email, or number fields with a numeric value, etc.

Tip: Use the :invalid selector to select form elements with a value that does not validate according to the element's settings.

Version: CSS3


Browser Support

The numbers in the table specifies the first browser version that fully supports the selector.

Selector
:valid 10.0 10.0 4.0 5.0 10.0


CSS Syntax

:valid {
    css declarations;
} Demo


Related Pages

CSS Selector :invalid



Color Picker

colorpicker