CSS3 столбцы - вдовы / сироты

Question

Я посмотрел вокруг, чтобы посмотреть, есть ли какой-нибудь достойный способ обработки вдов и сирот в многостолбцовых CSS3, но я был разочарован тем, что не нашел ни одного. Я сам пробовал свойства widow и orphan, но они ничего не делали.

Кто-нибудь знает, как использовать мультиколонки CSS3 и обрабатывать вдов и сирот?

Answer 1

Промежуточное решение этого заключается в добавлении

display: inline-block 

к элементу уровня блока, который вы хотите избежать разбивки по столбцам. Я недавно нуждался в этом для <li> и <dl>. Хорошо работает для любого.

Answer 2

В спецификации сказано, что алгоритмы должны чтить вдов и сирот . Не уверен, как много. Но вы можете контролировать это самостоятельно, сказав, никогда не ломайтесь внутри p.

Для этого вы в основном используете

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

Они принимают значения, такие как auto, который является значением по умолчанию, и avoid и always. Плюс несколько дополнительных.

Opera поддерживает это, и вы можете найти информацию здесь: http://www.opera.com/docs/specs/presto2.10/css/multicolumnlayout/