Profile cover photo
Profile photo
Markus Vocke
Webdesigner und Theme-Entwickler für Wordpress
Webdesigner und Theme-Entwickler für Wordpress
About
Markus's posts

Post has attachment

Post has attachment

Post has attachment
Erstklassig in vielerlei Hinsicht ...

Post has attachment

Post has attachment

Post has attachment
Wieder einmal aufgepasst, nicht dass hier die nächste Abmahnwelle bevorsteht ...

Post has shared content

Post has attachment

Könnt Ihr das folgende Szenario nachvollziehen bzw. bestätigen:

Media Queries (unabhängig ob in "em" oder "px") greifen nicht korrekt im Firefox (Version 28) sobald der Browser-Zoom genutzt wird.

Zum Nachvollziehen: http://web-funk.de/test/

Stellt unter http://viewportsizes.com/mine/ den Viewport auf 960px (vorher den Browser-Zoom eine Stufe verkleinern). Ruft dann die Testseite auf und verkleinert den Zoom auch dort um eine Stufe.

Während die Seite im Standard-Zoom die max-width-query korrekt umsetzt und einen grünen Hintergrund (bis einschließlich 960px) erzeugt, greift die max-width-query im gezoomten Zustand nicht mehr korrekt bis 960px sondern nur bis 959px.

In einer typischen Konstellation aus etwa

max-width 960px {...}
min-width 961px {...}

entsteht im gezoomten Zustand eine 1px breite Lücke in der keine der beiden Queries greift und das Layout entsprechend zerschossen wird (sofern keine Standardwerte außerhalb der Media Queries definiert sind).

Durch die Definition von Standardwerten lassen sich Konsequenzen zwar vermeiden. Dafür müssen aber Werte überschrieben werden was durch die gewählte Variante aus max- und min-width aber eigentlich nicht notwendig wäre.

Ist das bereits bekannt, könnt Ihr das reproduzieren?

Könnt Ihr das folgende Szenario nachvollziehen bzw. bestätigen:

Media Queries (unabhängig ob in "em" oder "px") greifen nicht korrekt im Firefox (Version 28) sobald der Browser-Zoom genutzt wird.

Zum Nachvollziehen: http://web-funk.de/test/

Stellt unter http://viewportsizes.com/mine/ den Viewport auf 960px (vorher den Browser-Zoom eine Stufe verkleinern). Ruft dann die Testseite auf und verkleinert den Zoom auch dort um eine Stufe.

Während die Seite im Standard-Zoom die max-width-query korrekt umsetzt und einen grünen Hintergrund (bis einschließlich 960px) erzeugt, greift die max-width-query im gezoomten Zustand nicht mehr korrekt bis 960px sondern nur bis 959px.

In einer typischen Konstellation aus etwa

max-width 960px {...}
min-width 961px {...}

entsteht im gezoomten Zustand eine 1px breite Lücke in der keine der beiden Queries greift und das Layout entsprechend zerschossen wird (sofern keine Standardwerte außerhalb der Media Queries definiert sind).

Durch die Definition von Standardwerten lassen sich Konsequenzen zwar vermeiden. Dafür müssen aber Werte überschrieben werden was durch die gewählte Variante aus max- und min-width aber eigentlich nicht notwendig wäre.

Ist das bereits bekannt, könnt Ihr das reproduzieren?
Wait while more posts are being loaded