Propriété column-span

La propriété column-span définit le nombre de colonnes sur lesquelles un élément doit s'étendre dans un texte multicolonnes. La propriété accepte comme valeur soit le nombre 1, soit le mot-clé all. Avec la valeur 1, l'élément couvrira une colonne, et avec la valeur all - toutes les colonnes.

Syntaxe

csssélecteur {
  column-span: 1 | all;
}

Valeur par défaut : 1.

Exemple

Dans cet exemple, le titre se trouvera à l'intérieur de la première colonne :

html<div id="elem">
  <h2>Lorem ipsum dolor sit amet eu metus non</h2>
  some long text
</div>

css#elem h2 {
  column-span: 1;
  margin: 0;
}
#elem {
  column-count: 3;
  text-align: justify;
}

Результат:

Exemple

Et maintenant, le titre s'étendra sur toutes les colonnes :

html<div id="elem">
  <h2>Lorem ipsum dolor sit amet eu metus non</h2>
  some long text
</div>

css#elem h2 {
  column-span: all;
  margin: 0;
}
#elem {
  column-count: 3;
  text-align: justify;
}

Результат:

Voir aussi