CSS Selector Level 4 » User-interaction pseudo-class

This pseudo-class is called user-interaction pseudo-class and represents elements with invalid input but only after the user interacted with the matched element, for example by focusing it or trying to submit a form containing it.

# Syntax

:user-invalid {
    /* declarations */

# Example

:user-invalid {
    border-color: red;

In this example, the input with invalid content will have a red border after it gets focused.

Try example in CodePen

# Browser support

Platform Chrome Firefox Safari Edge Internet Explorer Opera
Desktop No Yes (88) No No No No
Mobile No Yes (88) No No No No

# Usage statistics (Alexa Top 1,250,000 sites)

Due to an extreme price increase of our statistics provider the data collection was stopped in September 2018.

Please wait a moment, the comments start loading now...
explorermozillachromesafariopera info external