grid in header, in main, in footer

[Rolf B]

Hallo Joe,

ein Grid wird für bestimmte Containerelemente festgelegt. Für welche, das entscheidet sich über den Selektor der CSS Regel, die das Grid erzeugt.

header {
   display: grid;
   ...
}

macht aus jedem header-Element ein Grid. Wenn Du mehrere Header auf der Seite hast (was nicht verboten ist), würde jeder dieser Header ein Grid werden und Du müsstest überlegen, ob Du Klassen ergänzen musst oder mit spezifischeren CSS Selektoren arbeiten musst, um zu vermeiden, dass ein Grid nicht dort entsteht wo Du es nicht haben willst.

Genauso macht

main {
   display: grid;
   ...
}

aus dem main-Element (wovon es typischerweise nur eins gibt - jedenfalls immer nur ein sichtbares geben darf) ein Grid.

Ein footer-Element würde aber weder durch die eine noch durch die andere Regel zu einem Grid werden. Du musst ein Grid nicht am Punkt X „einschalten“ und am Punkt Y wieder „ausschalten“. Es gilt nur für die im CSS Selektor getroffenen Elemente. Wenn deren Ende-Tag kommt, ist das Grid zu Ende.

Vielleicht verwechselst Du das mit float. Da muss man gelegentlich mal einem Element ein clear:both; geben, um für die bisherigen Floats einen Abschlus zu finden.

Rolf