HTML and CSS Reference
In-Depth Information
Figure 18-8. The image is rescaled to fit within the column box
Controlling How Columns Are Filled
The column-fill property determines how to fill the columns. It accepts either of the following values:
balance This is the default. It instructs the browser to try to balance the columns, so
that each one appears to have the same amount of content.
auto This instructs the browser to fill the columns sequentially. Some columns might
end up partially filled or with no content at all.
At the time of this writing, column-fill does not appear to be supported by any browser.
Dealing with Column Breaks
The break-before , break-after , and break-inside properties perform a similar role to the page break print
properties described in Chapter 16. But they're not only concerned with printing; they also control column
breaks onscreen.
When a multi-column element is printed out, each page break is treated as beginning a new row of columns
so each page is complete in itself. Figure 18-9 illustrates this principle.
Search WWH ::

Custom Search