[SASS] mixin @media rule Verknüpfung der Expressions?

[molily]

@media
only screen and (-webkit-min-device-pixel-ratio: 2)      and (min-width: 60em),

Ist weiterhin nötig z.B. für Safari 7.0.

only screen and (   min--moz-device-pixel-ratio: 2)      and (min-width: 60em),

Firefox unterstützt min-resolution ab Version 16 (Oktober 2012). Halte ich daher für unnötig.

Aber warum die ständige Wiederholung von »only screen«? Diesen only-Quatsch hat man ohnehin nur für »older user agents« erfunden. Ich weiß gar nicht mehr für welche. Ich fahre sehr gut ohne diesen »only screen«.

only screen and (     -o-min-device-pixel-ratio: 2/1)    and (min-width: 60em),

Opera (Presto) ist tot. Diese letzte Opera-Presto-Version 12.16 unterstützt aber auch min-resolution.

only screen and (        min-device-pixel-ratio: 2)      and (min-width: 60em),

Ich wüsste keinen Browser, der das unterstützt, aber kein min-resolution.

only screen and (                min-resolution: 192dpi) and (min-width: 60em),

min-resolution mit dpi-Wert Unterstützt IE ab Version 9.

only screen and (                min-resolution: 2dppx)  and (min-width: 60em) {

Das ist die empfohlene und standardisierte Schreibweise, sollte also auf jeden Fall drin sein. Wird unterstützt von Firefox und Chrome.

Übrigens sehe ich wenig Sinn darin, in Media Queries für Device-Pixel-Ratio auch noch die Viewport-Breite einzubeziehen. Das sind zwei Dinge, die erst einmal wenig miteinander zu tun haben. Natürlich muss man sie ggf. kombinieren. Beispiel: Kleine Viewports mit 1dppx bekommen ein 200px-Foto, kleine Viewports mit 2dppx bekommen ein 400px-Foto, große Viewports mit 1dppx bekommen ein 600px-Foto, große Viewports mit 2dppx ein 1200px-Foto. (Ob man das wirklich so machen würde, ist eine andere Frage.)

Mathias