Свойство column-rule

Свойство column-rule задава граница между колонки в многоколонен текст. По приемани стойности съвпада със свойство border.

Пример . Тип solid

В този пример текст ще се раздели на 3 колони с граници между колоните във вид на плътна линия с дебелина 1px (разстоянието между колоните ще се формира автоматично, тъй като е зададен column-gap със стойност normal):

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

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

Пример . Влияние на column-gap

В този пример текст ще се раздели на 3 колони с разстояние между тях от 50px. Границата ще премине по средата на разстоянието (отдясно и отляво на границата ще има по 25px):

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

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

Вижте също

свойство column-width,
което задава ширината на колоната
свойство column-count,
което задава броя на колоните
свойство column-gap,
което задава разстоянието между колоните
свойство column-span,
което задава броя на колоните, на които трябва да се разпъва елемент
свойство columns,
което е свойство-съкращение за многоколонност