The column-count
CSS property describes the number of columns of the element.
column-count: 3; column-count: auto; column-count: inherit; column-count: initial; column-count: unset;
Syntax
Initial value | auto |
---|---|
Applies to | non-replaced block elements (except table elements), table-cell or inline-block elements |
Inherited | no |
Media | visual |
Computed value | as specified |
Animation type | an integer |
Canonical order | the unique non-ambiguous order defined by the formal grammar |
Values
auto
- Is a keyword indicating that the number of columns should be determined by other CSS properties, like
column-width
. <number>
- Is a strictly positive
<integer>
describing the ideal number of columns into which the content of the element will be flowed. If thecolumn-width
is also set to a non-auto value, it merely indicates the maximum allowed number of columns.
Formal syntax
How to read CSS syntax.<number> | auto
Examples
.content-box { border: 10px solid #000000; column-count: 3; }
Specifications
Specification | Status | Comment |
---|---|---|
CSS Multi-column Layout Module The definition of 'column-count' in that specification. |
Candidate Recommendation | Initial definition |
Browser compatibility
[1] Unprefixed as of Chrome 50.
[2] Unprefixed as of Gecko 52, with prefixed aliases still available.
Document Tags and Contributors
Tags:
Contributors to this page:
llkk,
arronei,
chrisdavidmills,
erikadoyle,
Sebastianz,
jpmedley,
fscholz,
tim_kraut,
jsx,
teoli,
kscarfone,
Sheppy,
ethertank,
brianloveswords,
kuvik3,
Marsf,
SPQRobin,
Jürgen Jeka,
DBaron,
Waldo,
BijuGC
Last updated by:
llkk,