:in-range and :out-of-range CSS pseudo-classes
- WDIf a temporal or number <input> has max and/or min attributes, then :in-range matches when the value is within the specified range and :out-of-range matches when the value is outside the specified range. If there are no range constraints, then neither pseudo-class matches.
Chrome
- 4: Not supported
- 5 - 14: Support unknown
- 15 - 51: Partial support
- 52: Partial support
- 53 - 118: Supported
- 119: Supported
- 120 - 122: Supported
Edge
- 12: Not supported
- 13 - 18: Partial support
- 79 - 118: Supported
- 119: Supported
Safari
- 3.1 - 4: Not supported
- 5: Support unknown
- 5.1 - 10: Partial support
- 10.1 - 17.0: Supported
- 17.1: Supported
- 17.2 - TP: Supported
Firefox
- 2 - 28: Not supported
- 29 - 49: Partial support
- 50 - 119: Supported
- 120: Supported
- 121 - 123: Supported
Opera
- 9 - 9.6: Support unknown
- 10 - 12.1: Partial support
- 15 - 38: Partial support
- 39: Partial support
- 40 - 103: Supported
- 104: Supported
IE
- 5.5 - 10: Not supported
- 11: Not supported
Chrome for Android
- 119: Supported
Safari on iOS
- 3.2 - 4.3: Not supported
- 5 - 10.2: Partial support
- 10.3 - 17.0: Supported
- 17.1: Supported
- 17.2: Supported
Samsung Internet
- 4: Partial support
- 5 - 22: Supported
- 23: Supported
Opera Mini
- all: Partial support
Opera Mobile
- 10 - 12.1: Partial support
- 73: Supported
UC Browser for Android
- 15.5: Supported
Android Browser
- 2.1 - 3: Not supported
- 4 - 4.4.4: Partial support
- 119: Supported
Firefox for Android
- 119: Supported
QQ Browser
- 13.1: Supported
Baidu Browser
- 13.18: Supported
KaiOS Browser
- 2.5: Partial support
- 3: Supported
Note that <input type="range"> can never match :out-of-range because the user cannot input such a value, and if the initial value is outside the range, the browser immediately clamps it to the minimum or maximum (as appropriate) bound of the range.