CSS fragmentation
The CSS fragmentation module defines how content is displayed when it is broken (fragmented) and flows across multiple pages, regions, or columns. This module defines features for pagination, breaking variable fragment size and orientation, widows and orphans.
This module explains how content breaks across fragmentation containers and how such breaks can be controlled by the author. The generic term for breaking content across containers is fragmentation. Fragmentation occurs when an inline box wraps onto multiple lines. This can happen when using layout features such as CSS multi-column layout: For example, when a block spans more than one column inside a column layout container, or spans a page break when printed. Each piece of the rendering for the element is called a fragment.
When content is physically printed or displayed as a print preview, there are page breaks. In this paged media, as opposed to continuous media, document content can be split between one or more pages, or fragments. To avoid awkward breaks, such as halfway through a line of text or with a lone word on its own page, browsers can move content that would otherwise fall across the page break in a process is called pagination.
Reference
>Properties
Glossary terms and definitions
Guides
- Handling content breaks in multi-column layout
-
Introduction to the fragmentation specification and how to control where column content breaks.
Related concepts
overflow
height
,max-height
, andblock-size
CSS propertieswidth
,max-width
, andinline-size
CSS properties- Block formatting context
CSS paged media module
CSS display module
- Principal box term
- Block formatting context guide
Specifications
Specification |
---|
CSS Fragmentation Module Level 3> |
See also
horizontal-viewport-segments
andvertical-viewport-segments
@media
descriptors- Viewport segments API
- CSS multi-column layout module