Definition and Usage
The :in-range and :out-of-range pseudo-classes apply only to elements that have range limitations. An element is :in-range or :out-of-range when the value that the element is bound to is in range or out of range of the presentation (e.g. visual or spoken representation) of the element respectively. An element that lacks data range limits or is not a form control is neither :in-range nor :out-of-range. E.g. a slider element with a value of 11 presented as a slider control that only represents the values from 1-10 is :out-of-range. Another example is a menu element with a value of "E" that happens to be presented as a popup menu that only has choices "A", "B" and "C".
Syntax
element:out-of-range { style properties }
Examples
input:out-of-range {
border: 1px solid #CB000F;
color: red
}
