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

Свойство column-rule практически совпадает с border, смотрите его при необходимости (между ними разница в том, что column-rule задает границу между колонками - с краю колонки это свойство границу задать не может).

См. все свойства для многоколоночности: column-count, column-width, column-gap, column-rule, column-span, columns.

Синтаксис

Порядок свойств значения не имеет.

селектор {
	column-rule: толщина тип цвет;
}
селектор {
	тип: solid | dotted | dashed | ridge | dooble | groove | inset | outset | none;
}
селектор {
	толщина: CSS единицы (кроме %) | thin | medium | thick;
}

Значения для типа

Тип линий совпадает с линиями в свойстве border-style, смотрите его при необходимости.

Значение Описание
solid Сплошная линия.
dotted Граница в виде точек.
dashed Граница в виде тире.
ridge Граница в виде выпуклой линии.
dooble Граница в виде двойной линии. Чтобы увидеть эффект толщина границы должна быть минимум 3px!
groove Вогнутая граница.
inset Рамка.
outset Рамка.
none Отсутствие границы.

Значения для толщины

Значение Описание
CSS единицы Значение в заданных CSS единицах, кроме процентов.
thin 2 пикселя.
medium 4 пикселя.
thick 6 пикселей.

Значение по умолчанию: medium none.

Цвет по умолчанию совпадает с цветом текста, заданным свойством color.

Примеры

Пример . Тип solid

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

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

Результат выполнения кода:

Быть энтузиасткой сделалось ее общественным положением, и иногда, когда ей даже того не хотелось, она, чтобы не обмануть ожиданий людей, знавших ее, делалась энтузиасткой. Сдержанная улыбка, игравшая постоянно на лице Анны Павловны, хотя и не шла к ее отжившим чертам, выражала, как у избалованных детей, постоянное сознание своего милого недостатка, от которого она не хочет, не может и не находит нужным исправляться. В середине разговора про политические действия Анна Павловна разгорячилась. — Ах, не говорите мне про Австрию! Я ничего не понимаю, может быть, но Австрия никогда не хотела и не хочет войны. Она предает нас. Россия одна должна быть спасительницей Европы. Наш благодетель знает свое высокое призвание и будет верен ему. Вот одно, во что я верю. Нашему доброму и чудному государю предстоит величайшая роль в мире, и он так добродетелен и хорош, что Бог не оставит его, и он исполнит свое призвание задавить гидру революции, которая теперь еще ужаснее в лице этого убийцы и злодея. Мы одни должны искупить кровь праведника… На кого нам надеяться, я вас спрашиваю?… Англия с своим коммерческим духом не поймет и не может понять всю высоту души императора Александра. Она отказалась очистить Мальту. Она хочет видеть, ищет заднюю мысль наших действий. Что они сказали Новосильцову?… Ничего. Они не поняли, они не могут понять самоотвержения нашего императора, который ничего не хочет для себя и все хочет для блага мира. И что они обещали? Ничего. И что обещали, и того не будет! Пруссия уж объявила, что Бонапарте непобедим и что вся Европа ничего не может против него… И я не верю ни в одном слове ни Гарденбергу, ни Гаугвицу. Cette fameuse neutralite prussienne, ce n`est qu`un piege. [Этот пресловутый нейтралитет Пруссии — только западня. ] Я верю в одного Бога и в высокую судьбу нашего милого императора. Он спасет Европу!.. — Она вдруг остановилась с улыбкою насмешки над своею горячностью. — Я думаю, — сказал князь улыбаясь, — что ежели бы вас послали вместо нашего милого Винценгероде, вы бы взяли приступом согласие прусского короля. Вы так красноречивы. Вы дадите мне чаю?

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

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

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

Результат выполнения кода:

Быть энтузиасткой сделалось ее общественным положением, и иногда, когда ей даже того не хотелось, она, чтобы не обмануть ожиданий людей, знавших ее, делалась энтузиасткой. Сдержанная улыбка, игравшая постоянно на лице Анны Павловны, хотя и не шла к ее отжившим чертам, выражала, как у избалованных детей, постоянное сознание своего милого недостатка, от которого она не хочет, не может и не находит нужным исправляться. В середине разговора про политические действия Анна Павловна разгорячилась. — Ах, не говорите мне про Австрию! Я ничего не понимаю, может быть, но Австрия никогда не хотела и не хочет войны. Она предает нас. Россия одна должна быть спасительницей Европы. Наш благодетель знает свое высокое призвание и будет верен ему. Вот одно, во что я верю. Нашему доброму и чудному государю предстоит величайшая роль в мире, и он так добродетелен и хорош, что Бог не оставит его, и он исполнит свое призвание задавить гидру революции, которая теперь еще ужаснее в лице этого убийцы и злодея. Мы одни должны искупить кровь праведника… На кого нам надеяться, я вас спрашиваю?… Англия с своим коммерческим духом не поймет и не может понять всю высоту души императора Александра. Она отказалась очистить Мальту. Она хочет видеть, ищет заднюю мысль наших действий. Что они сказали Новосильцову?… Ничего. Они не поняли, они не могут понять самоотвержения нашего императора, который ничего не хочет для себя и все хочет для блага мира. И что они обещали? Ничего. И что обещали, и того не будет! Пруссия уж объявила, что Бонапарте непобедим и что вся Европа ничего не может против него… И я не верю ни в одном слове ни Гарденбергу, ни Гаугвицу. Cette fameuse neutralite prussienne, ce n`est qu`un piege. [Этот пресловутый нейтралитет Пруссии — только западня. ] Я верю в одного Бога и в высокую судьбу нашего милого императора. Он спасет Европу!.. — Она вдруг остановилась с улыбкою насмешки над своею горячностью. — Я думаю, — сказал князь улыбаясь, — что ежели бы вас послали вместо нашего милого Винценгероде, вы бы взяли приступом согласие прусского короля. Вы так красноречивы. Вы дадите мне чаю?

Пример . Толщина ключевым словом

В данном примере толщина границы задается ключевым словом medium:

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

Результат выполнения кода:

Быть энтузиасткой сделалось ее общественным положением, и иногда, когда ей даже того не хотелось, она, чтобы не обмануть ожиданий людей, знавших ее, делалась энтузиасткой. Сдержанная улыбка, игравшая постоянно на лице Анны Павловны, хотя и не шла к ее отжившим чертам, выражала, как у избалованных детей, постоянное сознание своего милого недостатка, от которого она не хочет, не может и не находит нужным исправляться. В середине разговора про политические действия Анна Павловна разгорячилась. — Ах, не говорите мне про Австрию! Я ничего не понимаю, может быть, но Австрия никогда не хотела и не хочет войны. Она предает нас. Россия одна должна быть спасительницей Европы. Наш благодетель знает свое высокое призвание и будет верен ему. Вот одно, во что я верю. Нашему доброму и чудному государю предстоит величайшая роль в мире, и он так добродетелен и хорош, что Бог не оставит его, и он исполнит свое призвание задавить гидру революции, которая теперь еще ужаснее в лице этого убийцы и злодея. Мы одни должны искупить кровь праведника… На кого нам надеяться, я вас спрашиваю?… Англия с своим коммерческим духом не поймет и не может понять всю высоту души императора Александра. Она отказалась очистить Мальту. Она хочет видеть, ищет заднюю мысль наших действий. Что они сказали Новосильцову?… Ничего. Они не поняли, они не могут понять самоотвержения нашего императора, который ничего не хочет для себя и все хочет для блага мира. И что они обещали? Ничего. И что обещали, и того не будет! Пруссия уж объявила, что Бонапарте непобедим и что вся Европа ничего не может против него… И я не верю ни в одном слове ни Гарденбергу, ни Гаугвицу. Cette fameuse neutralite prussienne, ce n`est qu`un piege. [Этот пресловутый нейтралитет Пруссии — только западня. ] Я верю в одного Бога и в высокую судьбу нашего милого императора. Он спасет Европу!.. — Она вдруг остановилась с улыбкою насмешки над своею горячностью. — Я думаю, — сказал князь улыбаясь, — что ежели бы вас послали вместо нашего милого Винценгероде, вы бы взяли приступом согласие прусского короля. Вы так красноречивы. Вы дадите мне чаю?