Page break aliases
Deprecated: This feature is no longer recommended. Though some browsers might still support it, it may have already been removed from the relevant web standards, may be in the process of being dropped, or may only be kept for compatibility purposes. Avoid using it, and update existing code if possible; see the compatibility table at the bottom of this page to guide your decision. Be aware that this feature may cease to work at any time.
Warning: This property has been replaced by the break-after property.
The page-break-after CSS property adjusts page breaks after the current element.
Browser support
| Feature | Desktop | Mobile | ||||
|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Chrome Android | Safari iOS | |
page-break-after Deprecated | 1 | 12 | 1 | 1.2 | 18 | 1 |
always Deprecated | 1 | 12 | 1 | 1.2 | 18 | 1 |
auto Deprecated | 1 | 12 | 1 | 1.2 | 18 | 1 |
avoid Deprecated | 1 | 12 | | | 18 | |
left Deprecated | 1 | 12 | 1 | 1.2 | 18 | 1 |
right Deprecated | 1 | 12 | 1 | 1.2 | 18 | 1 |
| Other | ||||||
css.properties.page-break-before Deprecated The page-break-before CSS property adjusts page breaks before the current element. | 1 | 12 | 1 | 1.2 | 18 | 1 |
| CSS property | ||||||
always Deprecated | 1 | 12 | 1 | 1.2 | 18 | 1 |
auto Deprecated | 1 | 12 | 1 | 1.2 | 18 | 1 |
avoid Deprecated | 1 | 12 | | | 18 | |
left Deprecated | 1 | 12 | 1 | 1.2 | 18 | 1 |
right Deprecated | 1 | 12 | 1 | 1.2 | 18 | 1 |
| Other | ||||||
css.properties.page-break-inside Deprecated The page-break-inside CSS property adjusts page breaks inside the current element. | 1 | 12 | 19 | 1.3 | 18 | 1 |
| CSS property | ||||||
auto Deprecated | 1 | 12 | 19 | 1.3 | 18 | 1 |
avoid Deprecated | 1 | 12 | 19 | 1.3 | 18 | 1 |
- Until Firefox 25, `page-break-inside: avoid` did not work with the height of a block.
Syntax
/* Legacy syntax */
.no-break {
page-break-inside: avoid;
}
/* Recommended syntax */
.no-break {
break-inside: avoid;
}Live demo
Use cases
-
Component layout
Use Page break aliases to create more predictable spacing and placement inside reusable UI patterns.
-
Responsive structure
Adapt containers and flow rules so layouts stay stable across viewport changes.
Cautions
- Test layout rules with real content, long labels, and small screens before depending on them broadly.
- Prefer simpler layout primitives if they already solve the problem clearly.
Accessibility
- Layout choices should preserve reading order and support zoom without clipping.
- Avoid visually clever positioning that makes content harder to follow with keyboard or assistive tools.