CSS column-rule-width property

Definition and Usage

The column-rule-width property specifies the width rule between columns.

See Also:

CSS3 Tutorial:CSS3 Multi-column

HTML DOM Reference Manual:columnRuleWidth Property

Example

Set the color rule between columns:

div {
  column-rule-width: 10px;
}

Try It Yourself

More examples are at the bottom of the page.

CSS Syntax

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

Property Value

Value Description Test
thin Define thin rule. Test
medium Define medium rule. Test
thick Define the width of the rule. Test
length Specifies the width of the rule. Test

Technical Details

Default Value: medium
Inheritance: no
Version: CSS3
JavaScript Syntax: object.style.columnRuleWidth="thin"

More Examples

Column-count
Divides the text within a div element into three columns.
Column-gap
Divides the text within a div element into three columns, with a space of 30 pixels between them.
Column-rule
Specifies the width, style, and color between columns.

Browser Support

The numbers in the table indicate the first browser version that fully supports the property.

Numbers with -webkit- or -moz- prefixes indicate the first version using the prefix.

Chrome IE / Edge Firefox Safari Opera
50.0
4.0 -webkit-
10.0 52.0
2.0 -moz-
9.0
3.1 -webkit-
37.0
15.0 -webkit
11.1