This page is In Progress

Notice: The WebPlatform project, supported by various stewards between 2012 and 2015, has been discontinued. This site is now available on github.

break-inside

Summary

Control page/column/region breaks that fall within a block of content

Overview table

Initial value
auto
Applies to
block-level elements
Inherited
No
Media
visual

Computed value
:

Animatable
No
CSS Object Model Property
breakInside

Syntax

  • break-inside: auto
  • break-inside: avoid
  • break-inside: avoid-column
  • break-inside: avoid-page
  • break-inside: avoid-region

Values

auto
Default. A page/column/region break is determined by the flow of content.
avoid
A page/column/region break is not allowed within the content block.
avoid-page
A page break is not allowed within the content block.
avoid-column
A column break is not allowed within the content block.
avoid-region
A region break is not allowed within the content block.

Examples

/* forces top-level headings onto a new page, column, or region */
h1 {
    break-before: always;
}

/* binds subheads to subsequent content,
   without necessarily forcing a page break */
h2, h3 {
    break-after: avoid;
    break-inside: avoid;
}

Usage

 This property replaces separate column-break-inside, page-break-inside, and region-break-inside properties, which may still be present in some browser implementations.

Related specifications

CSS Regions Module Level 1
:

See also

Related articles

Multi-Column

Regions

External resources

Related pages

Attributions