CSS3 Columns - Widows / Orphans

I've looking around to see if there have been any decent way of handling widows and orphans 开发者_运维技巧in CSS3 multi-columns, but have been disappointed to find none. I've tried the widow and orphan properties themselves, but they didn't do anything.

Does anybody know of a way to use CSS3 multi-columns and handle widows and orphans?

An interim solution to this is to add

display: inline-block 

to the block level element you wish to avoid breaking across columns. I recently needed this for <li> and <dl>. Works well for either.

The spec says the algorhitms should honor widows and orphans. Not sure how many do. But you can control some of it yourself by saying never break inside a p.

For that, you basically use

• break-before
• break-after
• break-inside

They take values like auto which is default, and avoid and always. Plus a few extra.

Opera supports it, and you can find info here: http://www.opera.com/docs/specs/presto2.10/css/multicolumnlayout/