Właściwość column-count

Właściwość column-count ustawia rekomendowaną liczbę kolumn w tekście wielokolumnowym. Ich rzeczywista liczba może różnić się od ustawionej, w zależności od szerokości kolumny i rozmiaru odstępu między nimi.

Składnia

cssselektor {
  column-count: liczba | auto;
}

Wartości

Wartość domyślna: auto.

Przykład

W tym przykładzie tekst podzieli się na 3 kolumny (oczywiście, w przeglądarkach, które obsługują wielokolumnowość, w pozostałych będzie po prostu zwykły tekst w jednej kolumnie):

html<div id="elem">
  some long text
</div>

css#elem {
  column-count: 3;
  text-align: justify;
}

Результат:

Przykład . Wartość auto

W tym przykładzie ustawiono szerokość kolumny column-width na 150px, a ich liczba column-count jest ustawiona na wartość auto - przeglądarka sama dobierze wymaganą liczbę kolumn i odstęp między nimi:

html<div id="elem">
  some long text
</div>

css#elem {
  column-count: auto;
  column-width: 150px;
  text-align: justify;
}

Результат:

Zobacz też