The  column-rule-width property sets the width of the rule between columns. 


selector { 

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



Possible values for column-rule-width are:

  • medium; The default value. A medium rule width.
  • thin; A thin rule width.
  • thick; A thick rule width.
  • length; A number (px, em …) specifying the width of a rule.
  • initialinherit

This property actually allows us to specify a fixed width for the columns. The measurement of this width can be carried out in the standard way using px, ems etc. Percentage values can’t be used.

If this property is set to 'auto', then this means the width of the columns will be (should be) dictated by browser.

NOTE: Wifthout specifying the column-rule-style property, the width property will not be visible.


The column-rule-width property applied on paragraphs example:


›› go to examples ››