grid areas
bearbeitet von Rolf BHallo Jens,
ich sehe gerade "Zeile 3 und folgende" in deinem Plan. Da scheint mir ein Grid für die ganze Seite, das die Unterteilungen oben in Zeile 1+2 macht, nicht richtig.
Es dürfte mutmaßlich besser sein, den grauen Bereich aus dem Grid auszukoppeln und nur die beiden ersten Zeilen als Grid zu formatieren.
Wenn denn genug Platz ist, wie Gunnar anmerkte. Leider hat er nur das Problem dargestellt und den Lösungsvorschlag ausgelassen. 8em / 30% ≈ 26.7em, d.h. bei einer Viewportbreite - genauer: Grid-Breite - von unter 27em droht die Spalte 2 eine negative Breite zu bekommen. 27em ist schon wenig, da sind Media Breaks angesagt, um zumindest den Kopfbereich auf ein anderes Layout umzuschalten. Da hilft mein Vorschlag mit den benannten Bereichen weiter.
Wie man das konkret macht, muss man schauen - dafür müsstest Du ein Seitenlayout für Viewports unter 27em machen. Ob das der ideale Umschaltpunkt ist oder ob man das eher schon bei einer höheren Breite macht, ist deine Designentscheidung.
Am Desktop testen kannst Du das einfach durch Variieren der Fenstergröße deines Browsers, oder mit dem Device-Simulator der Entwicklertools des Browsers.
_Rolf_
--
sumpsi - posui - obstruxi