CSS/Eigenschaften/column-gap

Die Eigenschaft column-gap bestimmt für ein mehrspaltig anzuzeigendes Element den Abstand zwischen den Spalten.
Ursprünglich gab es für Grid Layout eine grid-column-gap, die jetzt aber auch für Flexbox gilt und im column-gap des Mehrspaltenlayouts (columns) aufgegangen ist.

erlaubte Werte	nichtnegative Längenangabe auto: Browser wählt Wert selbstständig aus Vererbung steuernde Werte inherit, initial, unset und revert Defaultwert: auto
anwendbar auf	alle Elemente
Browsersupport	Details: caniuse.com
Vererbung	nein
animierbar	nein

Beispiel

.beispiel1 ul {
  column-gap: 1em;
}

Die ul erhält ein Abstand von 1em zwischen den einzelnen Kindelementen.

Beachten Sie: Die Flächen zwischen den Spalten sind immer transparent und lassen sich nicht gestalten.

Empfehlung: Verwenden Sie für Grid Layout für eine Übergangszeit weiterhin die grid-gap-Eigenschaft!

Weblinks

• Spezifikation (W3C): column-gap

Siehe auch

• CSS/Tutorials/Abstand/gap#column-gap