page-break

page-break is not a CSS shorthand property. The historical names are page-break-before, page-break-after, and page-break-inside. Modern fragmentation properties are break-before, break-after, and break-inside.

A document you can test in print preview

<h1>Print test</h1>
<p>This paragraph belongs to the first page.</p>
<section class="new-page">
  <h2>Second page</h2>
  <p>This section starts on another printed page.</p>
</section>

@media print {
  .new-page {
    break-before: page;
  }
}

The screen preview stays continuous. Copy the document into a local file, open it, and use the browser’s Print command. The second section should begin on a new printed page. This exercise uses the browser’s actual print layout; the inline preview cannot demonstrate pagination accurately.

A practical rule

@media print {
  .chapter { break-before: page; }
  .figure { break-inside: avoid; }
}

A forced page break separates chapters. Avoiding a break inside a figure asks the browser to keep its contents together where possible; a figure taller than a page still needs a fragmentation decision.

Legacy aliases and values

The old before/after value always maps to the modern value page, while auto, avoid, left, and right have legacy mappings. Do not replace page-break-before: always with break-before: always and assume identical page-only semantics.

The property acts on generated boxes. A hidden element with no box cannot force a break. Tables, large blocks, browser print settings, and the available page area can affect pagination. Test the complete document rather than a single isolated declaration.

Continue with orphans and widows for line-level pagination controls.

Source

MDN: break-before documents modern values and legacy alias mappings.