Колонны CSS3 - Вдова/Сироты

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

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

Ответ 1

Временным решением для этого является добавление

display: inline-block 

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

Ответ 2

Спектр говорит, что algorhitms должен отмечать вдов и сирот. Не уверен, сколько это делают. Но вы можете сами контролировать его, говоря, что никогда не ломаетесь внутри p.

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

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

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

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