Style columnRuleStyle attribute

Definition and usage

columnRuleStyle This attribute specifies the style of the rules between columns.

See also:

CSS3 Tutorial:Multicol de CSS

CSS Reference Manual:column-rule-style attribute

Example

Change the style of the rules between columns:

document.getElementById("myDIV").style.columnRuleStyle = "dotted";

Try it yourself

Syntax

Return columnRuleStyle attribute:

object.style.columnRuleStyle

Set columnRuleStyle attribute:

object.style.columnRuleStyle = "none|hidden|dotted|dashed|solid|double|groove|ridge|inset|outset|initial|inherit"
Value Description
none Defines a border without borders. Default.
hidden Same as "none", except when resolving border conflicts in table elements.
dotted Defines a dotted border.
dashed Defines a dashed border.
solid Defines a solid border.
double Defines two borders. The width of both borders is the same as the value of border-width.
groove Defines a 3D grooved border. The effect depends on border-color value.
ridge Defines a 3D ridged border. The effect depends on border-color value.
inset Defines a 3D inset border. The effect depends on border-color value.
outset Defines a 3D outset border. The effect depends on border-color value.
initial Sets this property to its default value. See initial.
inherit Inherits this property from its parent element. See inherit.

Technical details

Default value: None
Return value: A string that represents the column-rule-style attribute.
CSS version: CSS3

Browser support

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
50.0 10.0 52.0 10.0 37.0