Search within TutorialsPark

CSS3 column-count Property

To set the strategy for filling the columns in a multiple column layout

Definition and Notes.

1. The CSS column-fill property specifies the strategy for filling the columns, it can either be balanced or not.

2. If the value is set as balanced, then the browser must minimize the variations in column length, other wise the columns are filled sequentially and some of the columns may end up being partially filled or with no content.


CSS column-count property. internetexplorer safari firefox opera chrome

View in Splitscreen»


Note- For continious media, this property is applied only if the length is constraint.Otherwise, the columns are balanced automatically.

Property Values

Value Description
balance If Possible, this value balances the content equally between the columns.
auto To fill the columns sequentially


Specs Value
Name column-fill
Value auto | balance
Initial Value balance
Applies to Multicolumn Elements
Javascript syntax"auto"
Inherited No
Computed Value Same as declared Value.
Browser Support internetexplorer safari firefox opera chrome

Related Examples.