Właściwość column-rule

Właściwość column-rule ustawia obramowanie między kolumnami w tekście wielokolumnowym. Pod względem przyjmowanych wartości pokrywa się z właściwością border.

Przykład . Typ solid

W tym przykładzie tekst zostanie podzielony na 3 kolumny z obramowaniami między kolumnami w postaci ciągłej linii o grubości 1px (odległość między kolumnami utworzy się automatycznie, ponieważ ustawiono column-gap na wartości normal):

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

#elem {
	column-rule: 1px solid black;
	column-count: 3;
	column-gap: normal;
	text-align: justify;
}

Przykład . Wpływ column-gap

W tym przykładzie tekst zostanie podzielony na 3 kolumny z odstępem między nimi wynoszącym 50px. Obramowanie przebiegnie przez środek odstępu (na prawo i lewo od obramowania będzie po 25px):

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

#elem {
	column-rule: 1px solid black;
	column-count: 3;
	column-gap: 50px;
	text-align: justify;
}

Zobacz też

właściwość column-width,
która ustawia szerokość kolumny
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-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ótem dla wielokolumnowości