Allgemeine Frage zu Media_Queries

[Matthias Apsel]

Hallo Melvin Cowznofski,

• Wieder etwas, was im Wiki noch fehlt.

War das Hinweis darauf, dass Du eine Wikiseite diesbezüglich gerade verändert/erweitert hast? =) Welche genau denn?

In dem Fall war es so, dass ich nur nicht aufmerksam geschaut habe. Der entsprechende Abschnitt war im Wiki drin. Sogar mit einer eigenen Überschrift. (@-Regeln)

Man möchte die Breakpoints nur in Ausnahmefällen in Pixel zementieren, das Layout soll sich dem Inhalt anpassen. Deshalb sollten die Breakpoints im em gesetzt werden.

Vielleicht kann man mtr bitte noch näher erläutern, wieso eine px-Angabe hier nicht gut ist!

Die kurze Antwort ist: Ein Pixel hat auf verschiedenen Geräten verschiedene Abmessungen. Die Größe em bezieht sich auf die Schriftgröße. rem auf die Schriftgröße des Wurzelelements. Damit kannst du die breakpoints entsprechend deines Inhaltes setzen. Schau dir dazu beispielsweise mal unser Wiki an und spiele mit der Fensterbreite. Dort habe ich mich an der Navigationsleiste "Lesen - Diskutieren - Fragen - Bearbeiten" orientiert. Wenn das nicht mehr in eine Zeile passt, habe ich die Gestaltung verändert. Jemand der eine große Schrift eingestellt hat, für den wechselt das Layout eher. Du kannst es testen indem du einstellst, dass nur der Text gezoomt werden soll.

Das ist ein guter Einwand, ich habe das deshalb soeben getestet: Ich habe eine Standard HTML Datei geschrieben und für die Viewportbreite und Höhe meines iPads 2 verschiedene Stylesheets, in denen jeweils eine Hintergrundfarbe für den Body steht, hochgeladen. Dann habe ich mein iPad im Hochformat gehalten, die Seite aufgerufen, die Internetverbindung unterbrochen und dann das Gerät um 90 Grad ins Panoramaformat gewendet und die Hintergrundfarbe ist wie gewollt umgesprungen. Also ist es offensichtlich so, dass beim erstaufruf der Seite beide extrenen Stylesheets geladen wurden und auch zur Anwendung kommen. Sprich - kein Nachladen.

Das könnte auch daran liegen, dass dein iPad gemerkt hat, dass es über wlan im Internet ist, möglicherweise sogar am Browsercache. Im Allgemeinen würde dieses Verhalten aber dem Grundgedanken der Verwendung der @import-Regel zuwider laufen, nämlich nicht benötigte Ressourcen nicht zu laden.

Ein reset-Stylesheet halte ich nicht für sinnvoll.

Aber egal - jedenfalls würde ich die Diskussion ob Reset Stylesheets ja oder nein heute gerne außen vor lassen und beim eigentlichen Thema bleiben. Bitte!

Ich will dich nicht bekehren, meinen Standpunkt habe ich geschrieben, den möchte ich dennoch wiederholen: Alle default-Einstellungen sind sinnvoll, die meisten browserübergreifend sehr sehr ähnlich. Nur damit ich das letze Wort habe ;-)

Bis demnächst
Matthias