Style columnGapProperty
Examples
Specify a 40-pixel gap between the columns:
document.getElementById("myDIV").style.columnGap="50px";
Try it Yourself »
Definition and Usage
The columnGap property specifies the gap between the columns.
Note:If a column-rule is set between the columns, it will appear in the middle of the gap.
Browser Support
![]()
Internet Explorer 10 and Opera support the columnGap property.
Firefox supports an alternative property that can replace it, namely the MozColumnGap property.
Safari and Chrome support an alternative property that can replace it, namely the WebkitColumnGap property.
Note:Internet Explorer 9 and earlier versions do not support the columnGap property.
Syntax
Return the columnGap property:
object.style.columnGap
Set the columnGap property:
object.style.columnGap="length|normal|initial|inherit"
Property Values
| Value | Description |
|---|---|
| length | Sets the gap between the columns to a specified length. |
| normal | Default value. Specifies that the gap between the columns is a normal gap. The value recommended by W3C is 1em. |
| initial | Sets this property to its default value. Seeinitial。 |
| inherit | Inherits this property from its parent element. Seeinherit。 |
Technical Details
| Default Value: | normal |
|---|---|
| Return Value: | A string, representing the column-gap property of an element. |
| CSS Version | CSS3 |
Related Articles
CSS3 Tutorial:CSS3 Multi-columns
CSS Reference:column-gap property
Other Extensions
Style Object