CSS Selector Level 3 » Enabled and Disabled pseudo-class

This enabled and disabled pseudo-classes match all enabled or disabled elements. :disabled elements are disabled if they can't be activated (selected, clicked, accept text input, or accept focus) during :enabled represents all focusable, active elements.

# Syntax

Copy
:enabled {
    /* declarations */
}

:disabled {
    /* declarations */
}

# Example

Copy
:enabled {
    border-color: green;
}
 
:disabled {
    border-color: gray;
}

In this example will the enabled (normal state) input element have a green border and the disabled elements a gray border.

Try example in CodePen

# Browser support

Platform Chrome Firefox Safari Edge Internet Explorer Opera
Desktop Yes (1) Yes (1) Yes (3) Yes (12) Yes (9) Yes (9)

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