Vlastnost column-width

Vlastnost column-width nastavuje šířku sloupců ve vícesloupcovém textu. Hodnotou vlastnosti jsou libovolné jednotky pro velikosti, kromě procent, nebo klíčové slovo auto (ve výchozím nastavení). Při hodnotě auto prohlížeč sám volí optimální šířku sloupců na základě column-count a column-gap.

Syntaxe

cssselektor {
  column-width: hodnota;
}

Příklad . Zadaná šířka

V tomto příkladu je zadána šířka sloupce column-width na 150px, a jejich počet column-count je nastaven na hodnotu auto. Výsledkem bude, že šířka sloupců bude 150px, jejich počet a mezera mezi nimi prohlížeč zvolí sám:

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

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

Результат:

Příklad . Hodnota auto

V tomto příkladu se text rozdělí na 3 sloupce (protože column-width je nastaveno na hodnotu 3), ale jejich šířka se vypočte automaticky:

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

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

Результат:

Viz také