CSS column-gap Eigenschaft

Definition und Verwendung

Die column-gap-Eigenschaft legt die Lücke zwischen den Spalten fest.

Anmerkung:Wenn zwischen den Spalten eine column-rulees wird in der Mitte der Lücke angezeigt.

Siehe auch:

CSS3-Tutorial:CSS3 Mehrspalten

HTML DOM Referenzhandbuch:columnGap-Eigenschaft

Beispiel

Legt die Lücke zwischen den Spalten auf 40 Pixel fest:

div {
  column-gap: 40px;
}

Probieren Sie es selbst aus

Mehr Beispiele am Seitenende.

CSS-Syntax

column-gap: length|normal;

Eigenschaftswert

Wert Beschreibung Test
length Setzt die Lücke zwischen den Spalten auf die angegebene Länge. Test
normal Legt die Lücke zwischen den Spalten auf einen normalen Abstand fest. Der von W3C empfohlene Wert ist 1em. Test

Technische Details

Standardwert: normal
Vererbbarkeit: nein
Version: CSS3
JavaScript-Syntax: object.style.columnGap="40px"

Mehr Beispiele

Column-count
Teilt den Text im div-Element in drei Spalten ein.
Column-rule
Legt die Breite, den Stil und die Farbe zwischen den Spalten fest.

Browser-Unterstützung

Die Zahlen in der Tabelle kennzeichnen die erste Browser-Version, die die Eigenschaft vollständig unterstützt.

Zahlen mit -webkit- oder -moz- als Präfix stellen die erste Version dar, die den Präfix verwendet.

Eigenschaft Chrome IE / Edge Firefox Safari Opera
In mehreren Spalten 50 10 52 10 37
In einem Gitter 66 16 61 12 53
In einem elastischen Rahmen 84 84 63 14.1 70