Vlastnosť column-span

Vlastnosť column-span nastavuje počet stĺpcov, na ktoré sa má prvok rozťahovať v viacstĺpcovom texte. Vlastnosť ako hodnotu prijíma buď číslo 1, alebo kľúčové slovo all. Pri hodnote 1 prvok bude zaberať jeden stĺpec, a pri hodnote all - všetky stĺpce.

Syntax

cssselektor {
  column-span: 1 | all;
}

Predvolená hodnota: 1.

Príklad

V tomto príklade sa nadpis umiestni dovnútra prvého stĺpca:

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;
}

Результат:

Príklad

A teraz sa nadpis rozťahuje na všetky stĺpce:

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;
}

Результат:

Pozri tiež

  • vlastnosť column-count,
    ktorá nastavuje počet stĺpcov
  • vlastnosť column-width,
    ktorá nastavuje šírku stĺpca
  • vlastnosť column-gap,
    ktorá nastavuje medzeru medzi stĺpcami
  • vlastnosť column-rule,
    ktorá nastavuje ohraničenie medzi stĺpcami
  • vlastnosť columns,
    ktorá je skrátenou vlastnosťou pre viacstĺpkovosť