Style columnRuleProperty
Examples
Sets the width, style, and color rules between columns:
document.getElementById("myDIV").style.columnRule="3px outset blue";
Try it Yourself »
Definition and Usage
The columnRule property is a shorthand property for setting all the columnRule* properties.
The columnRule property sets the width, style, and color rules between columns.
Browser Support
![]()
Internet Explorer 10 and Opera support the columnRule property.
Firefox supports an alternative property, the MozColumnRule property.
Safari and Chrome support an alternative property, the WebkitColumnRule property.
Syntax
Return the columnRule property:
object.style.columnRule
Set the columnRule property:
object.style.columnRule="column-rule-width column-rule-style column-rule-color|initial|inherit"
Property Values
| Value | Description |
|---|---|
| columnRuleWidth | Sets the width rule between columns. Default value is medium. |
| columnRuleStyle | Sets the style rule between columns. Default value is none. |
| columnRuleColor | Sets the color rule between columns. Default value is the element's color. |
| initial | Sets this property to its default value. Seeinitial。 |
| inherit | Inherits this property from its parent element. Seeinherit。 |
Technical Details
| Default Value: | medium none color |
|---|---|
| Return Value: | A string, representing the column-rule property of an element. |
| CSS Version | CSS3 |
Related Articles
CSS3 Tutorial:CSS3 Multi-column
CSS Reference Manual:column-rule property
Other Extensions
Style Object