備忘録的プログラミングリファレンス

page-break-insideプロパティ

 page-break-insideプロパティはbreak-insideプロパティの別名で、break-insideプロパティに置き換えられました。
 page-break-insideプロパティは、印刷時にエレメント内での改ページを回避するプロパティです。page-break-insideプロパティで回避されたエレメントで改ページは設定されません。
 page-break-insideプロパティはブラウザによって機能しない場合があり注意が必要です。

 page-break-afterプロパティは、position:absolute;が設定されたエレメントは機能しません。

エレメント内での改ページを回避する
page-break-inside: avoid;

関連プロパティ

 関連するプロパティに以下のものがあります。

page-break-after
設定された後が改ページ
page-break-before
設定された前が改ページ

構文(Syntax)

CSS

page-break-inside: auto | avoid | initial | inherit;

DOM(JavaScript)

値の取得
String = object.style.pageBreakInside;
値の設定
object.style.pageBreakInside="auto | avoid | initial | inherit";

値(Values)

 初期値(default値)のautoは、任意に改ページを入れない設定と同じです。エレメントの途中でもページに収まらない場合は自動で改ページが入ります。

Value摘要
auto初期値(default値)
avoid改ページを禁止
initial初期値に戻す
inherit親エレメントのプロパティを継承

備考(Remarks)

初期値(Default value)auto
継承(Inherited)No
CSS AnimationNo

Example

 page-break-insideプロパティの例です。例は別窓で開きます。印刷プレビューで改ページを確認して下さい。
 <div id="contents02">エレメントの内容は分割されずにプレビューが表示されます。できなければブラウザが対応していません。