Media query range syntax

The range syntax of CSS media queries allows you to use mathematical comparison operators such as <, >, <=, and >= to define a range of values for a media query. For example, (400px < width < 1000px) returns true if the viewport width is between 400px and 1000px.

Baseline Status: Achieved Widely Available on Sep 27, 2025 (Cross-browser Newly Available since Mar 27, 2023).

Desktop Browser Engine Support

Google Chrome

104

Supported

Mozilla Firefox

102

Supported

Apple Safari

16.4

Supported

Microsoft Edge

104

Supported

Mobile Browser Engine Support

Chrome Android

104

Firefox Android

102

Safari iOS

16.4

Specifications and References

Specification ↗ Can I Use (css-media-range-syntax) ↗ Feature XML ↗

MDN Browser Compat Data Keys:

css.at-rules.media.range_syntax ↗