Re: [css3-mediaqueries] min-width, max-width, & fractional-pixel widths

07.02.2017, 00:33, "Tab Atkins Jr." <jackalmage@gmail.com>:
> On Mon, Feb 6, 2017 at 1:27 PM, Simon Sapin <simon.sapin@exyr.org> wrote:
>> Tab, Florian, how do you feel about the spec stability on this?
>> Is it time to start implementing?
>
> Yes, please GOD implement it.
> That part of the spec is stable as a rock from a design perspective

Fwiw, web developers, too, are EAGERLY waiting for the `@media (width < 300px)` feature to be implemented while implementation should probably be trivial.

This is especially an issue with HiDPI displays where fractional CSS pixels are natural — e.g. one physical pixel corresponds to 0.5 CSS pixels at OS-level zoom of 200% on a 4K monitor, so the situation when neither of adjacent-range `@media` rules are applied happens quite often.

The current limitation forces us to avoid using adjacent ranges _at all_. Instead, we are forced to use ranges that _include_ each other, so e.g. in higher-range `@media` rules, we are forced to _override_ styles (just for the purpose of cancelling them) specified in lower-range `@media` rules and unneeded in higher ranges, and with real-world complex stylesheets, this is like a nightmare.

    @media (min-width: 300px) {
        .example {
            backround: red;
        }
    }

    @media (min-width: 600px) {
        /* Here we're forced to override styles from the `@media (min-width: 300px)` rule: */
        .example {
            background: none;
        }
    }

    /* Though could just write this: */
    @media (300px <= width < 600px) {
        .example {
            backround: red;
        }
    }

Received on Monday, 6 February 2017 23:19:38 UTC