Propriedade column-rule
A propriedade column-rule define uma borda
entre colunas em texto multicoluna.
Em termos de valores aceitos, coincide com a propriedade
border.
Exemplo . Tipo solid
Neste exemplo, o texto será dividido em 3
colunas com bordas entre as colunas na forma de
uma linha sólida com espessura de 1px (a distância
entre as colunas será formada automaticamente,
pois column-gap
está definido com o valor normal):
<div id="elem">
some long text
</div>
#elem {
column-rule: 1px solid black;
column-count: 3;
column-gap: normal;
text-align: justify;
}
:
Exemplo . Influência do column-gap
Neste exemplo, o texto será dividido em 3
colunas com um espaçamento entre elas de 50px.
A borda passará pelo meio do espaçamento
(à direita e à esquerda da borda haverá 25px cada):
<div id="elem">
some long text
</div>
#elem {
column-rule: 1px solid black;
column-count: 3;
column-gap: 50px;
text-align: justify;
}
:
Veja também
-
a propriedade
column-width,
que define a largura da coluna -
a propriedade
column-count,
que define o número de colunas -
a propriedade
column-gap,
que define o espaçamento entre colunas -
a propriedade
column-span,
que define o número de colunas que um elemento deve abranger -
a propriedade
columns,
que é uma propriedade abreviada para multicolunas
