私は、大量のアイテムのコレクションを取得して、それを Cocoa の WebView の HTML にポップするソフトウェア用のプラグインを作成しています (これは WebKit をレンダラーとして使用するため、基本的にこの HTML ファイルは Safari で開かれていると想定できます)。
作成される DIV の高さは動的ですが、あまり変化しません。通常は 200 ピクセル程度です。いずれにしても、ドキュメントごとにこのような項目が約 600 個あるため、印刷するのは非常に困難です。運が良ければ、各ページの下部と上部でエントリが半分に分割され、実際に印刷するのは非常に困難です。
page-break-before、page-break-after、page-break-inside、およびこれら 3 つの組み合わせを試しましたが、効果はありませんでした。WebKit が指示を適切にレンダリングしていないか、または私がその使用方法を理解していないのだと思います。いずれにせよ、助けが必要です。印刷時に DIV が半分にカットされないようにするにはどうすればよいですか?
ベストアンサー1
使用侵入する動作するはずです:
@media print {
div {
break-inside: avoid;
}
}
効果はすべての主要ブラウザ:
- クローム50+
- エッジ12+
- Firefox 65以上
- オペラ 37+
- サファリ10以上
代わりに使用してpage-break-inside: avoid;も動作するはずですが、まさに非推奨によるbreak-inside: avoid。