CSS Multi-column Layout is a module of CSS that adds support for multi-column layouts. Support is included for establishing the number of columns in a layout, as well as how content should flow from column to column, gap sizes between columns, and column dividing lines (known as column rules) along with their appearance.
In the following example the column-count
property has been applied to the element with a class of container. As the value of column-count
is 3
, the content is arranged into 3 columns of equal size.
Multiple-column Layout is closely related to Paged Media, in that each column box becomes a fragment, much like a printed page becomes a fragment of an overall document. Therefore the properties now defined in the CSS Fragmentation specification are required in order to control how content breaks between columns.
Specification | Status | Comment |
---|---|---|
CSS Multi-column Layout Module | Working Draft | Initial definition |
Other CSS layout technologies include:
© 2005–2018 Mozilla Developer Network and individual contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Columns