CSS - Grid - Grid in Zelle mit Abstand drum herum

[Rolf B]

Hallo ebody,

Werde ich probieren und mir merken.

So bitte nicht merken. Die Folgezeile / 1fr 100px; gehört unbedingt dazu.

Für die Eigenschaften grid-template-areas, grid-template-columns und grid-template-rows gibt es die Sammeleigenschaft grid-template. Die Zeichenketten für die Zeilennamen werden jeweils um die Höhe dieser Zeile ergänzt (also der jeweilige Wert aus grid-template-rows dorthin gesetzt. Dann kommt ein Schrägstrich und die Werte aus grid-template-columns.

Ich hätte also statt der Eigenschaft grid auch die Eigenschaft grid-template hinschreiben können.

Aber: Es gibt eine weitere Verdichtungsstufe durch die Kombination von grid-template mit grid-auto-rows und grid-auto-columns zu grid. Wenn man speziellen Werte für auto-rows und auto-columns nicht verwendet, hat grid die gleiche Wirkung wie grid-template.

Artikel im Selfwiki

Rolf