Wenn Sie Ihre Spalten auf einer bestimmten Breite halten möchten, verwenden Sie column-width
.
section ( -webkit-column-width: 200px; -moz-column-width: 200px; column-width: 200px; )
Der Browser berechnet, wie viele Spalten mit mindestens dieser Breite in den Raum passen. Stellen Sie sich column-width
einen Vorschlag für eine Mindestbreite für den Browser vor.
column-width
ist eine flexible Eigenschaft. Sobald der Browser nicht mindestens 2 Spalten mit der angegebenen Breite aufnehmen kann, werden die Spalten angehalten und in eine einzelne Spalte eingefügt.
Diese Eigenschaft wird auch in der Kurzform für verwendet columns
und kann zusammen mit verwendet werden column-count
. Wenn beide Eigenschaften deklariert sind, column-count
ist die maximale Anzahl von Spalten.
Werte
Sie können column-width
auf auto
oder eine Länge einstellen .
Verwenden auto
Sie diese Option, wenn Sie column-count
die Eigenschaft auch verwenden oder deaktivieren müssen. Stellen Sie sich das vor, um dem Browser zu sagen column-count
, dass er die Führung übernehmen soll.
Verwenden Sie zum Festlegen der Spaltenbreite eine Länge größer (oder gleich) 0. Sie können jede CSS-Einheit außer dem Prozentsatz verwenden.
Browser-Unterstützung
Unterstützung für mehrspaltiges Layout:
Chrom | Safari | Feuerfuchs | Oper | IE | Android | iOS |
---|---|---|---|---|---|---|
Irgendein | 3+ | 1,5+ | 11.1+ | 10+ | 2.3+ | 6.1+ |
Vergessen Sie nicht Ihre Präfixe!