Übersicht

Die CSS Eigenschaft column-fill bestimmt die Aufteilung von Inhalten auf Spalten. Inhalte können entweder gleichmäßig verteilt werden, damit alle Spalten dieselbe Höhe haben, oder sie nehmen den Raum ein, den der Inhalt benötigt, sofern auto verwendet wird.

Initialwertbalance
Anwendbar aufmehrspaltige Elemente
VererbtNein
Medienvisual, aber in kontinuierlichen Medien hat sie keinen Effekt in überlaufenden Spalten
Berechneter Wertwie angegeben
Animationstypdiskret
Kanonische Reihenfolgenach Grammatik

Syntax

/* Schlüsselwortwerte */
column-fill: auto;
column-fill: balance;

/* Globale Werte */
column-fill: inherit;
column-fill: initial;
column-fill: unset;

Werte

auto
Die Spalten werden fortlaufend gefüllt.
balance
Der Inhalt wird gleichmäßig aufgeteilt.

auto | balance | balance-all

Beispiel

.content-box {
  column-count: 4;
  column-rule: 1px solid black;
  column-fill: balance;
  height: 200px;
}

Spezifikationen

Spezifikation Status Kommentar
CSS Multi-column Layout Module
Die Definition von 'column-fill' in dieser Spezifikation.
Arbeitsentwurf Ursprüngliche Definition

Browser Kompatibilität

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid WebviewChrome für AndroidEdge MobileFirefox für AndroidOpera für AndroidSafari auf iOSSamsung Internet
Grundlegende UnterstützungChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 52
Vollständige Unterstützung 52
Vollständige Unterstützung 13
Mit Präfix
Mit Präfix Benötigt das Herstellerpräfix: -moz-
IE ? Opera ? Safari ? WebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaEdge Mobile Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 52
Vollständige Unterstützung 52
Vollständige Unterstützung 14
Mit Präfix
Mit Präfix Benötigt das Herstellerpräfix: -moz-
Opera Android ? Safari iOS ? Samsung Internet Android Vollständige Unterstützung Ja

Legende

Vollständige Unterstützung  
Vollständige Unterstützung
Kompatibilität unbekannt  
Kompatibilität unbekannt
Benötigt ein Herstellerpräfix oder einen anderen Namen zur Verwendung.
Benötigt ein Herstellerpräfix oder einen anderen Namen zur Verwendung.

Schlagwörter des Dokuments und Mitwirkende

Mitwirkende an dieser Seite: SJW, Sebastianz, fscholz
Zuletzt aktualisiert von: SJW,