Summary

The :indeterminate CSS pseudo-class represents:

  • any <input type="checkbox"> element whose indeterminate DOM property is set to true by JavaScript
  • <input type="radio"> elements whose radio button group's radio buttons are all unchecked
  • <progress> elements in an indeterminate state

Example

CSS

input, span {
  background: red;
}

:indeterminate, :indeterminate + span {
  background: limegreen;
}

HTML

<input type="checkbox"> <span>Everything in this paragraph should have a green background.</span>

JavaScript

document.getElementsByTagName("input")[0].indeterminate = true;

Specifications

Specification Status Comment
WHATWG HTML Living Standard
The definition of ':indeterminate' in that specification.
Living Standard No change
HTML5
The definition of ':indeterminate' in that specification.
Recommendation Defines the semantic regarding HTML and constraint validation.
Selectors Level 4
The definition of ':indeterminate' in that specification.
Working Draft No change
CSS Basic User Interface Module Level 3
The definition of ':indeterminate' in that specification.
Candidate Recommendation Defines the pseudo-class, but not the associated semantic.

Browser compatibility

Feature Chrome Firefox (Gecko) Internet Explorer Edge Opera Safari
type="checkbox" (Yes) 3.6 (1.9.2) 9.0 (Yes) 10.60 (2.6) 3.0
<progress> 6.0 6.0 (6.0) 10 (Yes) ? 5.2
type="radio" 39 No support [1] No support No support [3] ? No support [2]
Feature Android Firefox Mobile (Gecko) IE Mobile Edge Opera Mobile Safari Mobile
type="checkbox" ? 1.0 (1.9.2) ? ? ? ?
<progress> ? 6.0 (6.0) ? ? ? ?
type="radio" Chrome 39 No support [1] No support No support [3] ? No support [2]

[1]: bug 885359 – Radio groups without a selected radio button should have :indeterminate applying

[2]: WebKit bug #156270

[3]: Edge bug #7124038

Document Tags and Contributors

 Last updated by: cvrebert,