CSS :out-of-range Selector

:out-of-range is a CSS pseudo-class used to style elements that have range limitations when the value that the element bound to is outside the specified range limits.

The :out-of-range selector selects all elements with a value that is outside a specified range.

The :out-of-range CSS pseudo-class represents an < input > element whose current value is outside the range limits specified by the min and max attributes.

:out-of-range {css declarations;}

This pseudo-class is useful for giving the user a visual indication that a field's current value is outside the permitted limits.

The :out-of-range selector selects all elements with a value that is outside a specified range.

In other words, it matches an element when the value of its value attribute is outside the range limitations specified on it.Any other element that does not have data range limitations or that is not a form control element can not be selected with :out-of-range.Examples of elements with range limitations are sliders and inputs that accept a number as a value. For example:

Example -