add a min-height to CSS3 multi-columns
There is no minimum height, but the minimum number of lines at the end of a paragraph on their own at the start of a column are called orphans
(and the opposite... lines on their own at the start of a paragraph is widows
). These are CSS properties which columns should honour according to the spec, but I've done a quick test in Chrome and it doesn't make any difference. So I guess we have to wait for this to be implemented.
An example of how it should be set up:
p.columns {
column-count: 2;
orphans: 3
}
I know, this is an old one. But during my research this thread came up first, so I better share my results. There is a partial supported attribute called column-fill
which does, what you and I was looking for.
Partial means, you should use browser-specific prefixes...
column-count: 2;
column-width: auto;
column-fill: auto;
Here are the MDN Docs