Разрыв страницы внутри игнорируется

Question

Я динамически добавляю HTML с другой страницы и оформляю его для печати. Тем не мение, page-break-inside: avoid;применительно к моим элементам (любым из них), кажется, не учитывается при печати, даже если он отображается в стилях. Я использую Chrome 31 на Windows

Вот jsFiddle для упрощенной версии моей программы (ВНИМАНИЕ: через 3 секунды открывается предварительный просмотр. Чтобы остановить это, просто закомментируйте setInterval внизу), это версия, где page-break-inside:avoid не влияет на предварительный просмотр

Обычное "исправление" я нашел, добавив position:relative элементу и его родителю, не работает в моем случае. Префикс этого (как предложили несколько человек) тоже не работает

я знаю page-break-inside: avoid; работает в Chrome 31 с динамически размещаемыми элементами, потому что я протестировал его в псевдо-версии (ВНИМАНИЕ: это также открывает предварительный просмотр печати), но потратив часы на удаление кода, игру со стилями и исследования по теме (большинство посты очень устарели) Кажется, моя более сложная версия не работает так же

Заранее спасибо за любую информацию!

Answer 1

Измените свойство отображения на вашем идентификаторе #fromTumblr с inline-block в block,

Кажется логичным, что правила разрыва страницы не применяются к встроенным элементам, и поскольку этот идентификатор относится к элементу-обертке, размер которого превышает размер страницы, я полагаю, что по этой причине все остальные ваши правила игнорируются.

Вот обновленная скрипка, протестированная на Chrome 31 и FF26 на Windows: http://jsfiddle.net/FSyT5/27/