The style of the rule between columns.

      column-rule-style: RuleStyle ;

none - Don't display a rule (default)
hidden - Hide the rule
dotted - a dotted rule
dashed - a dashed rule
solid - a solid rule
double - a double rule
groove - a 3D grooved rule *
ridge - a 3D ridged rule *
inset - a 3D inset rule *
outset - a 3D outset rule *

* The 3D effects will vary with different combinations of width and color.

h1 { column-rule-style: solid; }
.ss64class { column-rule-style: dotted; }

#SS64id { column-rule-style: ridge; }

Try it:

When text is displayed in newspaper columns the length of each line is much shorter. This is a great aid to readability. On the internet many people will skim read large blocks of text and this can have the unfortunate effect that they miss important points buried in a long paragraph.

(CSS 3) Browser Support: IE 10, Opera. Use the equivalent -moz-column-rule-style for Firefox and -webkit-column-rule-style for Safari and Chrome.

“I don't want anyone reading my writing to think about style. I just want them to be in the story” ~ Willa Sibert Cather


column-gap - Gap between the columns.
column-rule-color - Color of the rule between columns.
column-rule-width - Width of the rule between columns.
column-rule - A shorthand property for all the column-rule-* properties.

© Copyright 1999-2017
Some rights reserved