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
- Animatable
- No
- CSS Object Model Property
breakInside
Syntax
break-inside: autobreak-inside: avoidbreak-inside: avoid-columnbreak-inside: avoid-pagebreak-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
See also
Related articles
Multi-Column
break-inside
Regions
break-inside
External resources
- W3C editor’s draft: CSS Regions Module Level 3
- Adobe Web Standards: CSS Regions
- Adobe Developer’s Network: CSS3 Regions: Rich page layout with HTML and CSS3
- Sample pages
Related pages
- CSSStyleDeclarationCSSStyleDeclaration
- currentStylecurrentStyle
- stylestyle
addressblockQuotedivdlfieldSetformnoFramesnoScriptolppre- tabletable
uldddtlitBodytdtFootthtHeadtrbuttondelinsmapobjectscriptReference- breakAfterbreakAfter
- breakBeforebreakBefore
Attributions
Microsoft Developer Network: [Windows Internet Explorer API reference Article]