break-after

The break-after property designates whether or not a break in a page, column, or region should happen after the specified element.

Syntax

With this property the browser can be told to avoid breaks after the specified element, or to break the page, column, or region after the element this property is applied to.

/*
    wrap <code> tags inside <pre> tags to create code blocks like this
*/

Values

auto
Default value. All breaks after the element are automatic.

all
Always insert a page-break after the principal box.

always
Always insert a page-break after the element.

avoid
Avoid all breaks after the element.

avoid-column
Avoid column-breaks after the element.

avoid-page
Avoid page-breaks after the element.

avoid-region
Avoid region-breaks after the element.

column
A column-break is always inserted after the element.

left
One or two page-breaks are inserted after the element so that the next page is formatted as a left page.

page
A page-break is always inserted after the element.

recto
One or two page-breaks are inserted after the principal box so that the next page is formatted as a recto page.

region
A region-break is always inserted after the element.

right
One or two page-breaks are inserted after the element so that the next page is formatted as a right page.

verso
One or two page-breaks are inserted after the principal box so that the next page is formatted as a verso page.

initial
Sets the property to its default value.

inherit
Inherits this property’s value from its parent item.

Browser Compatibilty

Demos

Have a code example of break-after? Submit a codepen.io demo and we'll showcase it here ↴