Zum Inhalt springen

grid-template-columns

  • Redaktion 
  • Zuletzt aktualisiert am

#grid-template-columns

Definiert die Spalten eines Raster-Containers. Sie können die Breite einer Spalte durch ein Schlüsselwort (wie auto) oder eine Länge (wie 10px) angeben. Die Anzahl der Spalten wird durch die Anzahl der Werte bestimmt, die in der durch Leerzeichen getrennten Liste definiert sind.

default grid-template-columns: none;

Es sind keine Spalten definiert, Sie haben also nur eine.

grid-template-columns: auto auto auto;

Sie können das Schlüsselwort auto verwenden, damit sich die Größe jeder Spalte automatisch ändert.

grid-template-columns: 80px auto 1rem;

Du kannst die Einheiten mischen.

grid-template-columns: 40px 1fr 2fr;

Du kannst die fr flex unit verwenden, um den verbleibenden Platz auf alle Flexspalten zu verteilen.