CSS - Propriété column-count
Description de la propriété column-count.
column-count définit le nombre de colonnes, dans le cadre d'une mise en page sur plusieurs colonnes.
Cette propriété fonctionne en coordination avec la largeur des colonnes (voir column-width) :
- Si Object n'est pas définie ou a la valeur
auto, le nombre de colonnes est exactement celui qui est défini parcolumn-count. - Si la valeur de Object est définie,
column-countindique alors le nombre de colonnes maximal. Le nombre de colonnes peut donc être plus petit pour permettre leur affichage dans la largeur demandée.
Si des sauts de colonnes forcés existent dans le contenu de l'élément, ils peuvent provoquer la création de
plus de colonnes que ce qui est prévu par column-count.
Rappel : les sauts de colonnes forcés sont définis par les propriétés break-before et break-after.
Pour une gestion plus responsive des colonnes (auto-adaptation à la taille de l'écran), reportez-vous aux
explications de la page columns.
Syntaxes pour column-count.
column-count: auto;Valeur par défaut. Le nombre de colonnes est déterminé à partir de la largeur des colonnes (voir
column-width). Si cette dernière n'est pas définie, le nombre de colonnes est égal à 1.column-count: 3;Un nombre sans unité, supérieur à zéro.
-
Reportez-vous à la description générale de ces valeurs.
Simulateur.
column-count :
if dans les langages
classiques, commence à apparaître en CSS par le biais de directives telles que @media
ou @supports.
Les variables font également leur apparition en CSS sous le nom de propriétés personnalisées.
Voir aussi...
Colonnes multiples - Propriétés.
break-after: Interdit ou impose des sauts (page, colonne...) après l'élément.break-before: Interdit ou impose des sauts (page, colonne...) avant l'élément.break-inside: Définit si les sauts de colonne, de page, etc. sont permis dans l'élément.column-fill: Gère la répartition du contenu entre les colonnes.column-gap: Définit l'espacement entre les colonnes.column-rule: Définit tous les paramètres du trait de séparation entre les colonnes.column-rule-color: Définit la couleur des lignes de séparation de colonnes.column-rule-style: Choisit le type de trait pour la séparation des colonnes.column-rule-width: Définit l'épaisseur du trait de séparation entre les colonnes.column-span: Gère le chevauchement du contenu sur plusieurs colonnes.column-width: Définit la largeur des colonnes.columns: Définit les caractéristiques d'une mise en page sur plusieurs colonnes.orphans: Gestion des coupures en bas de page.widows: Gestion des ruptures en haut de page.