Example
Select and style only if the value of the <input> element is invalid:
input:invalid
{
border: 2px solid red;
}
Try it Yourself »
Definition and Usage
The :invalid selector selects form elements with a value that does not validate according to the element's settings.
Note: The :invalid selector only works for form elements with limitations, such as input elements with min and max attributes, email fields without a legal email, or number fields without a numeric value, etc.
Tip: Use the :valid selector to select form elements with a value that validates 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 | |||||
|---|---|---|---|---|---|
| :invalid | 10.0 | 10.0 | 4.0 | 5.0 | 10.0 |
CSS Syntax
Related Pages
CSS Selector :valid