Controlling Page Breaks

Browsers can show very long pages in a single window thanks to the scroll bar. When visitors go to print a page, the contents of particularly long pages must be divided to fit on a given paper size. CSS lets you control where those page breaks should occur.

To control page breaks before elements:

In the style rule, type page-break-before: when or page-break-after:when, where when is one of always (so that page breaks always occur before/after the selected elements), avoid (so that page breaks only occur before/after the selected elements when absolutely necessary), or auto (to let the browser decide).

To keep elements from being divided between two pages:

In the style rule, type page-break-inside: avoid.

✓ Tips

  • The

Get HTML, XHTML, & CSS, Sixth Edition: Visual QuickStart Guide now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.