Irritationen beim Test von Mediaqueries im Firefox 25 (Bug?)

[molily]

Hallo,

Breakpoints in Media-Queries sollten nicht in px angegeben werden, sondern in em.

Ich unterstütze die Empfehlung, aber die Argumentation kann ich nicht nachvollziehen.

»Firstly, we’re already ditching pixels in favor of ems, rems and percentages in every other aspect of our styles, so why not carry that through to our media query values?«

Wenn ich Schrift in (r)em notiere, sollte ich auch Spaltenbreiten in (r)em notieren – klar.
Wenn ich aber Schrift in px notiere, kann ich auch Spaltenbreiten in px notieren.

»authoring media queries in relative units allows browsers to adjust the design based on the user zoom level, resulting in a more pleasant, more accessible reading experience.«

Das kann ich nicht nachvollziehen. Oder ich verstehe nicht, was der Text meint.

Beim Skalieren ändert sich die Device-Pixel-Ratio – in Chrome entspricht tatsächlich die »min-resolution« dem aktuellen Zoomfaktor. Bei 200% Zoom ist die resolution gleich 2dppx.

http://dabblet.com/gist/7790672

Wenn ich hier die Seite auf 200% skaliere, dann matcht die Media-Query min-width: 300px logischerweise erst bei 600 Device-Pixeln – weil ein CSS-Pixel nicht mehr einem Device-Pixel entspricht, sondern zwei.

Firefox, Chrome, Safari und IE 10 sind sich hier einig.

Wenn ich hier mit em-Werten arbeiten würde, hätte ich exakt dasselbe Browserverhalten.

Oder was verstehe ich hier falsch?

Mathias