lijndikte: de dikte van de lijn (thin, medium (standaard), thick, of een waarde in px).
lijnstijl: zie de tabel met stijlen hieronder.
kleur: de kleur van de rand. Die mag op elke manier worden opgegeven (naam, hsl, rgb, hex).
De waarden van column-rule moeten worden opgegeven in de volgorde: lijndikte lijnstijl kleur. Waarden mogen worden overgeslagen,
bv.border: solid red, border: thick double.
De niet genoemde waarden zijn dan de standaard waarden.
Stijlen
naam
stijl
voorbeeld stijlregel
none
(geen lijn)
column-rule: none;
hidden
(verborgen)
column-rule: 2px hidden blue;
dotted
column-rule: 2px dotted blue;
dashed
column-rule: 2px dashed blue;
solid
column-rule: 1px solid blue;
double
column-rule: 4px double blue;
groove
column-rule: 6px groove blue;
ridge
column-rule: 6px ridge blue;
inset
column-rule: 6px inset blue;
outset
column-rule: 6px outset blue;
Standaardwaarden, vererving
standaard
medium none color
vererft
nee
standaard color: de voorgrondkleur (tekstkleur) van het element
Opmerking
De lijndikte, lijnstijl en lijnkleur kunnen afzonderlijk worden opgegeven met de eigenschappen column-rule-width,
column-rule-style en column-rule-color.
De eigenschap column-span
De eigenschap column-span bepaalt de ruimte tussen de kolommen.
Voorbeeld
div {-webkit-column-span: 50px;/* Chrome, Safari, Opera */ -moz-column-span: 50px;/* Firefox */ column-width: 50px;
}
de normale tussnruimte (in de meeste browsers 1em)
initial
standaardwaarde (normal)
inherit
Erft de waarde van de parent.
Standaard waarde, vererving
standaard
normal
vererft
nee
Let op:
Gebruik deze eigenschap liever niet.
Zet in plaats daarvan de kop boven (buiten) het element met kolommen.
Reden: Firefox ondersteunt deze eigenschap niet.
De eigenschap column-width
De eigenschap column-width bepaalt de optimale, tevens maximale, breedte van een kolom.
De browser zal het aantal kolommen zó kiezen dat de kolombreedte zo groot mogelijk wordt binnen de bovengrens column-width.
Voorbeeld
div {-webkit-column-width: 300;/* Chrome, Safari, Opera */ -moz-column-width: 300px;/* Firefox */ column-width: 300px;
}