NWC – Liquid Layout die 2te
nun habe ich das NWC 2.5.5 – Liquid Theme mit einem Media Querie ausgestattet.
Früher wurden Media Queries hauptsächlich für die Zuordnung von Stylesheets für spezielle Ausgabegeräte verwendet.
<link rel="stylesheet" media="screen" href="screen.css">
<link rel="stylesheet" media="print" href="print.css">
<link rel="stylesheet" media="handheld" href="handheld.css">
Seit Css3 gibt es weitere Media Queries z.B. für Bildschirmbreiten bzw. Browserbreite und mehr.
Da das NWC – Liquid Theme im Contentbereich 2 Spalten hat dachte ich, dass ab einer Browserbreite von 480px das Theme nur noch einspaltig weiter laufen soll. Die Sidebar wird dann unter dem Content angezeigt.
Das funktioniert mit diesem Media Querie:@media screen and (max-width: 480px) { ... }
In den Bereich { ... } kommt der Stylesheet rein der angezeigt werden soll, wenn das Fenster eine Breite von 480px oder schmaler hat. Die Eigentschaften und Werte der normalen Selektoren gelten auch für die schmale Ansicht. Diese werden, wenn sie im Media Query neu angelegt werden aber überschrieben.