Propriété column-count
La propriété column-count définit un nombre recommandé
de colonnes dans un texte multicolonne.
Leur nombre réel peut différer de
celui spécifié, en fonction de la largeur des colonnes
et de la taille de l'espacement entre elles.
Syntaxe
sélecteur {
column-count: nombre | auto;
}
Valeurs
| Valeur | Description |
|---|---|
| nombre | Définit le nombre spécifié de colonnes. Plus précisément, il suggère au navigateur d'utiliser ce nombre de colonnes, car leur nombre réel peut différer de celui spécifié, en fonction de la largeur des colonnes et de la taille de l'espacement entre elles. |
auto |
Le navigateur détermine lui-même le nombre optimal de colonnes. |
Valeur par défaut : auto.
Exemple
Dans cet exemple, le texte sera divisé en 3
colonnes (bien sûr, dans les navigateurs qui
prennent en charge le multicolonnage, dans les autres
ce sera juste un texte ordinaire en une seule colonne) :
<div id="elem">
some long text
</div>
#elem {
column-count: 3;
text-align: justify;
}
:
Exemple . Valeur auto
Dans cet exemple, la largeur de colonne column-width
est définie à 150px, et leur nombre column-count
est défini sur la valeur auto - le navigateur
déterminera lui-même le nombre nécessaire de colonnes et
l'espacement entre elles :
<div id="elem">
some long text
</div>
#elem {
column-count: auto;
column-width: 150px;
text-align: justify;
}
:
Voir aussi
-
la propriété
column-width,
qui définit la largeur d'une colonne -
la propriété
column-gap,
qui définit l'espacement entre les colonnes -
la propriété
column-rule,
qui définit la bordure entre les colonnes -
la propriété
column-span,
qui définit le nombre de colonnes sur lesquelles un élément doit s'étendre -
la propriété
columns,
qui est une propriété raccourcie pour le multicolonnage
