Lastnost column-rule

Lastnost column-rule določa obrobo med stolpci v večstolpčnem besedilu. Po sprejetih vrednostih sovpada z lastnostjo border.

Primer . Tip solid

V tem primeru se besedilo razdeli na 3 stolpce z obrobami med stolpci v obliki polne črte debeline 1px (razdalja med stolpci se oblikuje samodejno, ker je določen column-gap z vrednostjo normal):

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

css#elem {
  column-rule: 1px solid black;
  column-count: 3;
  column-gap: normal;
  text-align: justify;
}

Результат:

Primer . Vpliv column-gap

V tem primeru se besedilo razdeli na 3 stolpce z vrzeljo med njimi v 50px. Obroba bo medtem potekala po sredini vrzeli (desno in levo od obrobe bo po 25px):

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

css#elem {
  column-rule: 1px solid black;
  column-count: 3;
  column-gap: 50px;
  text-align: justify;
}

Результат:

Glejte tudi