The width of the rule between columns.

      column-rule-width: thin | medium | thick | length ;

thin - Width less than the default.
medium - Default. A medium width border.
thick - Width greater than the default.
length - A floating-point number followed by an absolute or relative units designator (px, em, pt...)

The exact thickness of the column rule when using the medium, thin, or thick value is user agent dependent.

h1 { column-rule-width: 2em; }
.emw3class { column-rule-width: 1px; }

#emw3id { column-rule-width: medium; }

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-width for Firefox and -webkit-column-rule-width 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-rule-width - MDN Web Docs.
column-gap - Gap between the columns.
column-rule-color - Color of the rule between columns.
column-rule-style - Style of the rule between columns.
column-rule - A shorthand property for all the column-rule-* properties.
column-count - Number of columns an element should be divided into.

Copyright © 2013-2022
Some rights reserved