Hallo > > In den Media-Querys kann ich es ja nicht reinschreiben - oder? > > Du kannst auch mehrere [Media Queries](http://wiki.selfhtml.org/wiki/Media_queries#device-width) verwenden. Z.B. eine für device-width < 520, eine für device-with zwischen 520 und 900 und eine für über 900. Das ist *so* nicht ganz ideal. Die Aufzählung „<520px“, „520px-900px“ und „>900px“ fällt auseinander, wenn der TO irgendwann mal auf jemanden hört, der z.B. die Einheit „em“ statt „px“ empfiehlt. Glaube mir, so jemand wird kommen (und er wird mMn recht haben). Dann ergeben sich nämlich, selbst mit Nachkommastellen im Wert, Lücken. Zudem ist die Logik inkonsistent. Besser™ ist es, nach der Logik „Mobile first“ zu verfahren. Dabei werden zuerst die Regeln für schmale Viewports ohne Media-Query notiert. Mit Media-Queries für breitere Viewports werden diese Regeln ergänzt und überschrieben. ~~~css body { color: #000; } @media screen and (min-width: 36em) { body { color: #048; } @media screen and (min-width: 56em) { body { color: #c20; } ~~~ Das hat den Vorteil, nur in eine Richtung (Mindestbreite) Vorgaben für die Anwendung der Regeln zu machen. Kein „von bis“, nur ein „ab“. Das kann man, wie im Beispielcode zu sehen, mehrfach überschreiben. Tschö, Auge -- Verschiedene Glocken läuteten in der Stadt, und jede von ihnen vertrat eine ganz persönliche Meinung darüber, wann es Mitternacht war. Terry Pratchett, “Wachen! Wachen!

Hallo > > In den Media-Querys kann ich es ja nicht reinschreiben - oder? > > Du kannst auch mehrere [Media Queries](http://wiki.selfhtml.org/wiki/Media_queries#device-width) verwenden. Z.B. eine für device-width < 520, eine für device-with zwischen 520 und 900 und eine für über 900. Das ist *so* nicht ganz ideal. Die Aufzählung „<520px“, „520px-900px“ und „>900px“ fällt auseinander, wenn der TO irgendwann mal auf jemanden hört, der z.B. die Einheit „em“ statt „px“ empfiehlt [^1]. Dann ergeben sich nämlich, selbst mit Nachkommastellen im Wert, Lücken. Zudem ist die Logik inkonsistent. Besser™ ist es, nach der Logik „Mobile first“ zu verfahren. Dabei werden zuerst die Regeln für schmale Viewports ohne Media-Query notiert. Mit Media-Queries für breitere Viewports werden diese Regeln ergänzt und überschrieben. ~~~css body { color: #000; } @media screen and (min-width: 36em) { body { color: #048; } @media screen and (min-width: 56em) { body { color: #c20; } ~~~ Das hat den Vorteil, nur in eine Richtung (Mindestbreite) Vorgaben für die Anwendung der Regeln zu machen. Kein „von bis“, nur ein „ab“. Das kann man, wie im Beispielcode zu sehen, mehrfach überschreiben. [^1] Glaube mir, so jemand wird kommen (und er wird mMn recht haben). Tschö, Auge -- Verschiedene Glocken läuteten in der Stadt, und jede von ihnen vertrat eine ganz persönliche Meinung darüber, wann es Mitternacht war. Terry Pratchett, “Wachen! Wachen!