Example
Split the text into three columns, minimum 100 pixels each:
document.getElementById("myDIV").style.columns = "100px 3";
Try it Yourself »
Definition and Usage
The columns property is a shorthand property for setting columnWidth and columnCount.
Browser Support
The columns property is supported in Internet Explorer 10 and Opera.
Safari and Chrome support an alternative, the WebkitColumns property.
Firefox supports an alternative, the MozColumns property.
Syntax
Return the columns property:
object.style.columns
Set the columns property:
object.style.columns="auto|column-width column-count|initial|inherit"
Property Values
| Value | Description |
|---|---|
| auto | Default value. Sets both the column width to "auto" and the column-count to "auto" |
| columnWidth | The width of the columns |
| columnCount | The number of columns |
| 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: | auto auto |
|---|---|
| Return Value: | A String, representing the columns property of an element |
| CSS Version | CSS3 |
Related Pages
CSS3 tutorial: CSS3 Multiple Columns
CSS reference: columns property
< Style Object