Właściwość column-width

Właściwość column-width ustawia szerokość kolumn w tekście wielokolumnowym. Wartością właściwości są dowolne jednostki wielkości, z wyjątkiem procentów, lub słowo kluczowe auto (domyślnie). Przy wartości auto przeglądarka sama dobiera optymalną szerokość kolumn na podstawie column-count i column-gap.

Składnia

selektor {
	column-width: wartość;
}

Przykład . Określona szerokość

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

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

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

Przykład . Wartość auto

W tym przykładzie tekst zostanie podzielony na 3 kolumny (ponieważ column-width jest ustawione na wartość 3), a ich szerokość zostanie obliczona automatycznie:

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

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

Zobacz też

właściwość column-count,
która ustawia liczbę kolumn
właściwość column-gap,
która ustawia odstęp między kolumnami
właściwość column-rule,
która ustawia obramowanie między kolumnami
właściwość column-span,
która ustawia liczbę kolumn, na które powinien rozciągać się element
właściwość columns,
która jest właściwością skrótową dla wielokolumnowości