Vlastnosť column-count

Vlastnosť column-count nastavuje odporúčaný počet stĺpcov vo viacstĺpcovom texte. Ich skutočný počet sa môže líšiť od nastaveného, v závislosti od šírky stĺpca a veľkosti medzery medzi nimi.

Syntax

cssselektor {
  column-count: číslo | auto;
}

Hodnoty

Predvolená hodnota: auto.

Príklad

V tomto príklade sa text rozdelí na 3 stĺpce (samozrejme, v prehliadačoch, ktoré podporujú viacstĺpkovosť, v ostatných to bude jednoducho obyčajný text v jednom stĺpci):

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

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

Результат:

Príklad . Hodnota auto

V tomto príklade je zadaná šírka stĺpca column-width na 150px, a ich počet column-count je nastavený na hodnotu auto - prehliadač sám zvolí potrebný počet stĺpcov a medzeru medzi nimi:

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

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

Результат:

Pozrite tiež