Proprietà column-count
La proprietà column-count imposta un numero raccomandato
di colonne in un testo multicolonna.
Il loro numero effettivo potrebbe differire da
quello impostato, a seconda della larghezza della colonna
e della dimensione dello spazio tra di esse.
Sintassi
selettore {
column-count: numero | auto;
}
Valori
| Valore | Descrizione |
|---|---|
| numero | Imposta il numero specificato di colonne. Più precisamente, suggerisce al browser di utilizzare questo numero di colonne, poiché il loro numero effettivo potrebbe differire da quello impostato, a seconda della larghezza della colonna e della dimensione dello spazio tra di esse. |
auto |
Il browser sceglie automaticamente il numero ottimale di colonne. |
Valore predefinito: auto.
Esempio
In questo esempio il testo verrà suddiviso in 3
colonne (ovviamente, nei browser che
supportano il layout multicolonna, negli altri
sarà semplicemente testo normale in una singola colonna):
<div id="elem">
some long text
</div>
#elem {
column-count: 3;
text-align: justify;
}
:
Esempio . Valore auto
In questo esempio è stata impostata la larghezza della colonna column-width
a 150px, e il loro numero column-count
è impostato sul valore auto - il browser
sceglierà automaticamente il numero necessario di colonne e
lo spazio tra di esse:
<div id="elem">
some long text
</div>
#elem {
column-count: auto;
column-width: 150px;
text-align: justify;
}
:
Vedi anche
-
la proprietà
column-width,
che imposta la larghezza della colonna -
la proprietà
column-gap,
che imposta lo spazio tra le colonne -
la proprietà
column-rule,
che imposta la linea tra le colonne -
la proprietà
column-span,
che imposta il numero di colonne su cui un elemento deve estendersi -
la proprietà
columns,
che è una proprietà abbreviata per il layout multicolonna
