CSS PROPERTIES
Expand All|Collapse All
CSS AT-RULES
SPONSORED LINKS

CSS page-break-after Property

Topic: CSS3 Properties Reference« Prev|Next »

Description

The page-break-after CSS property insert page breaks after an element when printing a document. This properties applies to block-level elements that generate a box. It won't apply on an empty <p> that won't generate a box.

The following table summarizes the usages context and the version history of this property.

Default value: auto
Applies to: Block-level elements
Inherited: No
Animatable: No. See animatable properties.
Version: CSS 2, 3

Syntax

The syntax of the property is given with:

page-break-after auto | always | avoid | left | right | initial | inherit

The example below shows the page-break-after property in action.

  • @media print {
  •     p.footnotes {
  •         page-break-after: always;
  •     }
  • }

The style rule in the above example sets the page-breaking behavior to always break the page and move to a new page after footnotes.

 

Note:The page-break-after property only applicable to the block-level elements in the normal flow of the root element, or table-row elements.


Property Values

The following table describes the values of this property.

Value Description
auto Insert a page break after the element, if necessary. This is default value.
always Always force a page break after the element.
avoid Avoid a page break after the element.
left Forces either one or two page breaks after the element, so that the next page will be a left-hand page.
right Forces either one or two page breaks after the element, so that the next page will be a right-hand page.
initial Sets this property to its default value.
inherit If specified, the associated element takes the computed value of its parent element page-break-after property.

Browser Compatibility

The page-break-after property is partially supported in all major modern browsers.

Browsers Icon

Basic Support—

  • Firefox 1+
  • Google Chrome 1+
  • Internet Explorer 4+
  • Apple Safari 1.2+
  • Opera 7+
 

Warning:Internet Explorer 8 and earlier versions don't support the values left and right; either value is interpreted as the value always. Firefox, Chrome, and Safari don't support the values avoid, left, or right.


Further Reading

See tutorial on: CSS Media Types.

Related properties: page-break-before, page-break-inside.

 
Close

Your Feedback:

 

We would love to hear from you! Please say something.