Page-break-inside: избегать эквивалента для Firefox и/или IE

Я понимаю, что инструкция CSS page-break-inside:avoid должна предотвращать разрыв страницы в div при печати документа HTML. Через поиск в Интернете я обнаружил, что он поддерживается только Opera и IE8. Есть ли работа, которая позволяет мне предотвратить разрывы страниц в Firefox (3.6) или IE версии менее 8?

Ответ 1

Извините, мой ответ "невозможно", хотя мне бы это понравилось, если кто-то может доказать, что я не прав.

В последнее время я столкнулся с той же проблемой, и после небольшого исследования я решил просто пойти с

page-break-after: always;

после каждого количества элементов.

http://reference.sitepoint.com/css/page-break-inside

http://reference.sitepoint.com/css/page-break-after

Ответ 2

Попробуйте вместо этого использовать white-space:nowrap. Это должно помешать текстуру проникнуть внутрь элемента, по крайней мере, на экране. Я не уверен, как это переводится для печати материалов, но стоит попробовать.

Дополнительная информация: http://www.blooberry.com/indexdot/css/properties/text/whitespace.htm

Ответ 3

Для всего, что не является firefox,

.dontsplit { border: 2px solid black; page-break-inside: avoid; }

будет работать. Но не для firefox. В firefox вам нужно будет проверить высоту, а затем добавить page-break-after: always;, когда это будет актуально.

В среднем маржа будет 1 дюйм сверху и снизу. Таким образом, чтобы измерить, сколько пикселей будет потребляться 10-дюймовой страницей, я использовал это:

var pageOfPixels;
(function(){
    var d = document.createElement("div");
    d.setAttribute("style", "height:9in;position:absolute;left:0px;top:0px;z-index:-5;");
    document.body.appendChild(d);
    pageOfPixels = $(d).height();
    d.parentNode.removeChild(d);
})();

У меня было много divs с множеством абзацев. Итак, что я сделал, я пропустил через них, а затем сравнил текущую высоту их с текущей страницей с параметром pageOfPixels.

var currentPosition = 0;
$('.printDiv').each(function (index, element) {
    var h = $(this).height();
    if (currentPosition + h > pageOfPixels) {
        //add page break
        $('.printDiv').eq(index - 1).css("page-break-after", "always");
        currentPosition = h;
    } else {
        currentPosition += h;
    }
});

Это работало для меня в firefox.

Ответ 4

Как только совпадение всего элемента внутри вашего элемента, кроме первых, и чтобы они не прерывались перед

#yourelement *+*{
    page-break-before: avoid;
}