Can you add a minimum height to CSS3 multi columns?
I'd rather have a single column when the text only has four lines rather than forcing a single line over to the second column.
For example I would rather:
Lorem ipsum dolor sit amet
sodales id ipsum ipsum mauris
interdum qui congue
nisl quis, turpis tristique
Not this:
Lorem ipsum dolor sit amet nisl quis, turpis tristique
sodales id ipsum ipsum mauris
interdum qui congue
Any advice?
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
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With