break-after

A propriedade break-after do CSS configura como uma quebra de página, coluna ou região deve se comportar após renderizar um elemento. Se nenhum elemento foi renderizado, a propriedade é ignorada.

/* Generic break values */
break-after: auto;
break-after: avoid;
break-after: always;
break-after: all;

/* Page break values */
break-after: avoid-page;
break-after: page;
break-after: left;
break-after: right;
break-after: recto;
break-after: verso;

/* Column break values */
break-after: avoid-column;
break-after: column;

/* Region break values */
break-after: avoid-region;
break-after: region;

/* Global values */
break-after: inherit;
break-after: initial;
break-after: unset;

Each possible break point (in other words, each element boundary) is affected by three properties: the break-after value of the previous element, the break-before (en-US) value of the next element, and the break-inside (en-US) value of the containing element.

To determine if a break must be done, the following rules are applied:

If any of the three concerned values is a forced break value (always, left, right, page, column, or region), it has precedence. If more than one of them are such a break, the one of the element that appears the latest in the flow is taken (i.e., the break-before value has precedence over the break-after value, which itself has precedence over the break-inside value).
If any of the three concerned values is an avoid break value (avoid, avoid-page, avoid-region, or avoid-column), no such break will be applied at that point.

Once forced breaks have been applied, soft breaks may be added if needed, but not on element boundaries that resolve in a corresponding avoid value.

Initial value	`auto`
Aplica-se a	block-level elements
Inherited	não
Computed value	as specified
Animation type	discrete

Syntax

The break-after property is specified as one of the keyword values from the list below.

Values

Generic break values

auto: Allows, but does not force, any break (page, column, or region) to be inserted right after the principal box.
avoid: Avoids any break (page, column, or region) from being inserted right after the principal box.
always Experimental: Forces a page break right after the principal box. The type of this break is that of the immediately-containing fragmentation context. If we are inside a multicol container then it would force a column break, inside paged media (but not inside a multicol container) a page break.
all Experimental: Forces a page break right after the principal box. Breaking through all possible fragmentation contexts. So a break inside a multicol container, which was inside a page container would force a column and page break.

Page break values

avoid-page: Avoids any page break right after the principal box.
page: Forces a page break right after the principal box.
left: Forces one or two page breaks right after the principal box, whichever will make the next page into a left page.
right: Forces one or two page breaks right after the principal box, whichever will make the next page into a right page.
recto Experimental: Forces one or two page breaks right after the principal box, whichever will make the next page into a recto page. (A recto page is a right page in a left-to-right spread or a left page in a right-to-left spread.)
verso Experimental: Forces one or two page breaks right after the principal box, whichever will make the next page into a verso page. (A verso page is a left page in a left-to-right spread or a left right in a right-to-left spread.)

Column break values

avoid-column: Avoids any column break right after the principal box.
column: Forces a column break right after the principal box.

Region break values

avoid-region Experimental: Avoids any region break right after the principal box.
region Experimental: Forces a region break right after the principal box.

Formal syntax

break-after = 
  auto          |
  avoid         |
  always        |
  all           |
  avoid-page    |
  page          |
  left          |
  right         |
  recto         |
  verso         |
  avoid-column  |
  column        |
  avoid-region  |
  region

Page break aliases

For compatibility reasons, the legacy page-break-after (en-US) property should be treated by browsers as an alias of break-after. This ensures that sites using page-break-after continue to work as designed. A subset of values should be aliased as follows:

page-break-after	break-after
`auto`	`auto`
`left`	`left`
`right`	`right`
`avoid`	`avoid`
`always`	`page`

Nota: The always value of page-break-* was implemented by browsers as a page break, and not as a column break. Therefore the aliasing is to page, rather than the always value in the Level 4 spec.

Specifications

Specification	Status	Comment
CSS Fragmentation Module Level 3 The definition of 'break-after' in that specification.	Candidata a Recomendação	Adds the `recto` and `verso` keywords. Changes the media type of this property from `paged` to `visual` (en-US). Defines the breaking algorithm with different kinds of breaks.
CSS Regions Module Level 1 The definition of 'break-after' in that specification.	Rascunho atual	Extends the property to handle region breaks. Adds the `avoid-region` and `region` keywords.
CSS Multi-column Layout Module The definition of 'break-after' in that specification.	Rascunho atual	Initial definition. Extends the CSS 2.1 `page-break-after` (en-US) property to handle both page and column breaks.

Browser compatibility

BCD tables only load in the browser