nicht angemeldet
Hallo werte Selfgemeinde!
Nach längerer Pause bin ich aktuell mal wieder dabei ein neues Layout zu erstellen.
Ein wichtiger Punkt dabei ist mir u.a. eine möglichst optimale (und sinnvolle) Ausnutzung des jeweils zur Verfügung stehenden Anzeigebereichs.
Dabei soll die angenommene "Bandbreite" vom FullHD Fernseher/ Monitor (1920x1200) bis hinunter zu Smartphones mit ca. 320x460 reichen.
Wenn ich jetzt mal die IEs außen vor lasse (was ich mir bei einer privaten HP ja durchaus erlauben kann), dann wären Media Queries das Mittel der Wahl.
Wie einige ältere Forumsbeiträge belegen, beschäftige ich mich nicht das erste Mal damit. Leider hat sich aber zwischenzeitlich nicht viel verändert.
Das größte "Problem" scheint mir nach wie vor zu sein, dass imho die Implementierung im Firefox 3.x, sagen wir mal vorsichtig, "buggy" ist. Und zwar wenn es an die Zoom-Funktion geht.
Damit, dass es (zumindest aktuell noch) keine Möglichkeit gibt, einen eventuell vom User eingestellten Zoomlevel zu berücksichtigen, kann ich mich ja noch abfinden. Aber dass der Firefox 3.x beim Zoomen auch die Werte für device-height und -width ändert, geht dann doch etwas zu weit. Zumal es dabei wohl keiner Diskussion bedarf, dass sich diese Werte durch egal welche Aktion der User im Browser ausführt, definitiv niemals ändern.
Die Kollegen Opera und Chrome machen es richtig.
BTW: Safari kann ich nicht testen - der stürzt beim Start immer ab (Win 7, 32Bit). Hat jemand das selbe Problem, bzw. weiß woran es liegt und wie man es abstellen kann?
Aber zurück zum eigentlichen Thema.
Ich fasse das Browserverhalten mal zusammen:
- Firefox (3.x)
ändert die Werte sowohl für height + width, als auch für device-height + device-width - Chrome (8.0)
ändert weder die Werte für height + width, noch für device-height + device-width - Opera (11.0)
ändert die Werte für height + width, nicht aber die für device-height + device-width
beim Zoomen.
Nach meinem Verständnis der Spec, macht es also nur der Opera "richtig/ korrekt".
Leider ist das Verhalten des Firefoxs das, welches man aus Autorensicht am wenigsten gebrauchen kann in diesem Zusammenhang.
Als "Workaround" fiele mir jetzt nur ein entweder per JS einen Font-Size Switcher einzubauen, oder mit alternativen Stylesheets zu arbeiten, die jeweils die Basis-Schriftgröße ändern (wobei natürlich alle relevanten Größen in EMs definiert sind) und zu hoffen, dass die User dann davon Gebrauch machen und auf die Browser Zoomfunktion verzichten.
Gibt es andere Möglichkeiten/ Alternativen?
Falls jemand von euch bereits Media Queries einsetzt, wie habt ihr es gemacht?
Was ist eure generelle Meinung zu dem Thema?
Gruß Gunther