Safari-break-side-inside: unikaj pracy

Question

Mam problem z CSS page-break-inside: avoid. Mam kilka bloków drukowania, które mają ustawiony ten atrybut css, jednak Safari burzy dowolną treść, tak jak ma to miejsce w przypadku prawdziwej strony, podczas gdy działa ona we wszystkich innych głównych przeglądarkach (obecnych wersjach), które testowałem do tej pory.

Nie ma to znaczenia, jaki rodzaj treści blok druk trzyma jak widziałem to zachowanie zarówno stół i element canvas jest rozdzielona, ​​w samym środku.

Jeśli chodzi o http://css-tricks.com/almanac/properties/p/page-break/ i http://developer.apple.com/library/safari/documentation/AppleApplications/Reference/SafariCSSRef/Articles/StandardCSSProperties.html, to powinno działać. Nie można znaleźć żadnych dodatkowych i najnowszych informacji w tej sprawie za pomocą szybkiego wyszukiwania.

Wszelkie sugestie? Dziękuję Ci.

BTW jestem na Windows 7 & Safari 5.1.7

Answer 1

Spróbuj użyć display: inline-block; zamiast page-break-inside: avoid;. Możesz również dodać vertical-align: top; i width: 100%;, aby elementy zachowywały się jak normalne elementy bloków zamiast elementów śródliniowych.

Technika ta pracuje niezawodnie od długo przed page-break-inside: avoid; został wdrożony w większości przeglądarek. Jest to nadal najbardziej niezawodny międzyplatformowy sposób zapobiegania łamaniu stron w bloku treści.

Jeśli chcesz, aby stół do złamania, można ustawić display: inline-table; na nim. Lub możesz po prostu umieścić go w div bloku inline.

Answer 2

strona-break-inside: unikać; ma inną składnię dla różnych przeglądarek.

-webkit-column-break-inside: avoid; /* Chrome, Safari, Opera */ 
page-break-inside: avoid; /* Firefox */ 
break-inside: avoid; /* IE 10+ */ 

To powinno działać dla Safari

-webkit-column-break-inside: avoid; 

Aby uzyskać więcej informacji prosimy sprawdzić: https://css-tricks.com/almanac/properties/b/break-inside/