Style columnRuleStyle Property
Example
Change the style of the rule between columns:
document.getElementById("myDIV").style.columnRuleStyle = "dotted";
Try it Yourself »
Description
The columnRuleStyle property specifies the style of the rule between columns.
Browser Support
| Property | |||||
|---|---|---|---|---|---|
| columnRuleStyle | 50.0 | 10.0 | 52.0 | 10.0 | 37.0 | 
Syntax
Return the columnRuleStyle property:
 object.style.columnRuleStyle 
Set the columnRuleStyle property:
 object.style.columnRuleStyle = "none|hidden|dotted|dashed|solid|double|groove|ridge|inset|outset|
initial|inherit"
Property Values
| Value | Description | 
|---|---|
| none | Default value. Defines no rule | 
| hidden | Defines a hidden rule | 
| dotted | Defines a dotted rule | 
| dashed | Defines a dashed rule | 
| solid | Defines a solid rule | 
| double | Defines a double rule | 
| groove | Specifies a 3D grooved rule. The effect depends on the width and color values | 
| ridge | Specifies a 3D ridged rule. The effect depends on the width and color values | 
| inset | Specifies a 3D inset rule. The effect depends on the width and color values | 
| outset | Specifies a 3D outset rule. The effect depends on the width and color values | 
| initial | Sets this property to its default value. Read about initial | 
| inherit | Inherits this property from its parent element. Read about inherit | 
Technical Details
| Default Value: | none | 
|---|---|
| Return Value: | A String, representing the column-rule-style property of an element | 
| CSS Version | CSS3 | 
Related Pages
CSS3 tutorial: CSS3 Multiple Columns
CSS reference: column-rule-style property
Copyright 1999-2023 by Refsnes Data. All Rights Reserved.