Breakafter

Break-after is a CSS property that controls fragmentation after an element in paged or multi-column layouts. It is part of the CSS Break Fragmentation Module and helps determine how content breaks across pages, columns, or regions. The property accepts keywords such as auto, avoid, page, left, right, and column. A value of page requests a page break after the element in paged media; avoid tells the user agent to avoid inserting a break after the element if possible; left and right indicate that the following content should begin on a left- or right-hand page in printed documents; column forces a break after the element to the next column in a multi-column layout. Auto delegates the decision to the user agent.

Break-after is complementary to break-before and break-inside, and relates to older page-break-after properties by governing fragmentation of content. It is applicable in contexts such as printed output and multi-column layouts, but its exact effect may be constrained by other layout rules or by the environment.

Examples: p { break-after: page; } will insert a page break after each paragraph (subject to other constraints). h1 { break-after: avoid; } attempts to prevent a break after a heading.

Browser support is broadly available in modern engines across Chrome, Firefox, Safari, and Edge. See also related properties break-before, break-inside, and the legacy page-break-* properties. Limitations include that break behavior is advisory rather than guaranteed; factors such as element height, content, overflow, and nested layouts can influence where breaks occur.