Proprietatea column-rule

Proprietatea column-rule definește bordura între coloane în textul multicoloană. În ceea ce privește valorile acceptate, coincide cu proprietatea border.

Exemplu . Tipul solid

În acest exemplu, textul va fi împărțit în 3 coloane cu borduri între coloane sub formă de linie continuă cu grosimea de 1px (distanța dintre coloane se va forma automat, deoarece este setat column-gap la valoarea 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;
}

Результат:

Exemplu . Influența column-gap

În acest exemplu, textul va fi împărțit în 3 coloane cu un spațiu între ele de 50px. Bordura va trece la mijlocul spațiului (la dreapta și la stânga bordurii vor fi câte 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;
}

Результат:

Vezi și