Rozumiem, że instrukcja CSS page-break-inside:avoid ma zapobiegać podziałowi strony w div podczas drukowania dokumentu HTML. Przeszukując internet, stwierdziłem, że jest on obsługiwany tylko przez Operę i IE8. Czy istnieje obejście, które pozwala mi zapobiec łamaniu stron w Firefox (3.6) lub wersjach IE mniejszych niż 8?strona-break-inside: unikaj odpowiednika dla przeglądarki Firefox i/lub IE
Jak tylko o dopasowanie wszystkich elementów wewnątrz elementu, z wyjątkiem tych pierwszych, a nie je łamać, zanim
#yourelement *+*{
page-break-before: avoid;
}
Pytanie dotyczy pytania o zgodność FF i starego IE, a nie o korzystanie z właściwości css. – aaaidan
Zauważ, że używam break-before-before, a nie strony-break-inside, która nie jest obsługiwana, dlatego musisz użyć tego dziwnego selektora, aby uzyskać ten sam efekt. Po drugie, ten post ma prawie 6 miesięcy. – Gerben
To nie zadziała dla ≤IE7 i Firefox [nie obsługuje] (https://bugzilla.mozilla.org/show_bug.cgi?id=132035) 'avoid' either. – Knu
Niestety, moja odpowiedź brzmi „nie możliwe”, chociaż chciałbym, jeśli każdy może mi udowodnić, że jestem zły.
ja wpadłem na ten sam problem ostatnio, a potem robi trochę badań postanowiłem po prostu iść z
page-break-after: always;
po każdych kilku elementów.
Pozwolę sobie dodać, że nadal nie jest zaimplementowany w Firefoksie 54 – Wolf
Spróbuj użyć white-space:nowrap zamiast. To powinno powstrzymać tekst przed włamaniem do wnętrza elementu, przynajmniej na ekranie. Nie jestem pewien, jak przekłada się to na media drukowane, ale warto spróbować.
Więcej informacji: http://www.blooberry.com/indexdot/css/properties/text/whitespace.htm
Dla wszystkiego, co nie jest firefox,
.dontsplit { border: 2px solid black; page-break-inside: avoid; }
zadziała. Ale nie dla firefox. W firefox, co musisz zrobić, to sprawdzić wysokość, a następnie dodać page-break-after: always;, gdy jest to istotne.
Średnio margines wynosi 1 cal na górze i na dole. Tak więc, aby zmierzyć ile pikseli strona 10 cali będzie konsumować, użyłem to:
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);
})();
miałem dużo DIV każdego z wielu akapitów w nich. Tak więc zrobiłem iterację przez nich, a następnie porównałem aktualną wysokość ich na bieżącej stronie z wartością 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;
}
});
To działało dla mnie w firefox.
Niestety, nie ma rozwiązania, ale działa ono dla mnie w Mac OS Firefox 3.6.10, ale zawiesza się w Mac OS Opera 10.62, nie działa w Safari. – daustin777