media-feature-range-notation

Specify context or prefix notation for media feature ranges.

@media (width >= 600px) and (min-width: 600px) {}
/**    ↑                    ↑
 *     These media feature notations */

Media features of the range type can be written using prefixes or the more modern context notation.

Because min- and max- both equate to range comparisons that include the value, they may be limiting in certain situations.

The message secondary option can accept the arguments of this rule.

The fix option can automatically fix some of the problems reported by this rule.

Options

string: "context"|"prefix"

"context"

Media feature ranges must always use context notation.

The following patterns are considered problems:

@media (min-width: 1px) {}

@media (min-width: 1px) and (max-width: 2px) {}

The following patterns are not considered problems:

@media (width >= 1px) {}

@media (1px <= width <= 2px) {}

"prefix"

Media feature ranges must always use prefix notation.

The following patterns are considered problems:

@media (width >= 1px) {}

@media (1px <= width <= 2px) {}

The following patterns are not considered problems:

@media (min-width: 1px) {}

@media (min-width: 1px) and (max-width: 2px) {}