Propriedade column-count
A propriedade column-count define um número recomendado
de colunas em texto multicoluna.
O número real pode diferir do
especificado, dependendo da largura da coluna
e do tamanho do intervalo entre elas.
Sintaxe
seletor {
column-count: número | auto;
}
Valores
| Valor | Descrição |
|---|---|
| número | Define o número especificado de colunas. Mais precisamente, recomenda ao navegador usar esse número de colunas, já que o número real pode diferir do especificado, dependendo da largura da coluna e do tamanho do intervalo entre elas. |
auto |
O navegador define o número ideal de colunas automaticamente. |
Valor padrão: auto.
Exemplo
Neste exemplo, o texto será dividido em 3
colunas (claro, em navegadores que
suportam multicolunas; nos demais,
será apenas texto comum em uma única coluna):
<div id="elem">
some long text
</div>
#elem {
column-count: 3;
text-align: justify;
}
:
Exemplo . Valor auto
Neste exemplo, a largura da coluna column-width
está definida como 150px, e seu número column-count
está definido como auto - o navegador
irá definir automaticamente o número necessário de colunas e
o intervalo entre elas:
<div id="elem">
some long text
</div>
#elem {
column-count: auto;
column-width: 150px;
text-align: justify;
}
:
Veja também
-
a propriedade
column-width,
que define a largura da coluna -
a propriedade
column-gap,
que define o intervalo entre colunas -
a propriedade
column-rule,
que define a borda entre colunas -
a propriedade
column-span,
que define o número de colunas que um elemento deve ocupar -
a propriedade
columns,
que é uma propriedade abreviada para multicolunas