: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 - 123: Supported
- 124: Supported
- 125 - 127: Supported
Edge
- 12: Not supported
- 13 - 18: Partial support
- 79 - 122: Supported
- 123: Supported
Safari
- 3.1 - 4: Not supported
- 5: Support unknown
- 5.1 - 10: Partial support
- 10.1 - 17.3: Supported
- 17.4: Supported
- 17.5 - TP: Supported
Firefox
- 2 - 28: Not supported
- 29 - 49: Partial support
- 50 - 124: Supported
- 125: Supported
- 126 - 128: Supported
Opera
- 9 - 9.6: Support unknown
- 10 - 12.1: Partial support
- 15 - 38: Partial support
- 39: Partial support
- 40 - 108: Supported
- 109: Supported
IE
- 5.5 - 10: Not supported
- 11: Not supported
Chrome for Android
- 123: Supported
Safari on iOS
- 3.2 - 4.3: Not supported
- 5 - 10.2: Partial support
- 10.3 - 17.3: Supported
- 17.4: Supported
- 17.5: Supported
Samsung Internet
- 4: Partial support
- 5 - 23: Supported
- 24: Supported
Opera Mini
- all: Partial support
Opera Mobile
- 10 - 12.1: Partial support
- 80: Supported
UC Browser for Android
- 15.5: Supported
Android Browser
- 2.1 - 3: Not supported
- 4 - 4.4.4: Partial support
- 123: Supported
Firefox for Android
- 124: Supported
QQ Browser
- 14.9: Supported
Baidu Browser
- 13.52: 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.