Propriété column-width

La propriété column-width définit la largeur des colonnes dans un texte multicolonne. La valeur de la propriété peut être n'importe quelle unité de taille, à l'exception des pourcentages, ou le mot-clé auto (par défaut). Lorsque la valeur est auto, le navigateur détermine automatiquement la largeur optimale des colonnes en se basant sur column-count et column-gap.

Syntaxe

csssélecteur {
  column-width: valeur;
}

Exemple . Largeur spécifiée

Dans cet exemple, la largeur de colonne column-width est définie à 150px, et leur nombre column-count est réglé sur auto. En conséquence, la largeur des colonnes sera de 150px, leur nombre et l'espacement entre elles seront déterminés automatiquement par le navigateur :

html<div id="elem">
  some long text
</div>

css#elem {
  column-count: auto;
  column-width: 150px;
  text-align: justify;
}

Результат:

Exemple . Valeur auto

Dans cet exemple, le texte sera divisé en 3 colonnes (car column-count est défini sur 3), tandis que leur largeur sera calculée automatiquement :

html<div id="elem">
  some long text
</div>

css#elem {
  column-width: auto;
  column-count: 3;
  text-align: justify;
}

Результат:

Voir aussi