CSS Selector Level 3 » Enabled and Disabled pseudo-class

This enabled and disabled pseudo-classes matches 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.0) Yes (1.0) Yes (3.0) Yes (12.0) Yes (9.0) Yes (9.0)

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