CSS break-after Property

The break-after property allows you to force a break on multi-column layouts. More specifically, it allows you to force a break after an element. It allows you to determine if a break should occur, and what type of break it should be. The break-after CSS property describes how the page, column or region break behaves after the generated box. If there is no generated box, the property is ignored.

Formal syntax: auto | always | avoid | left | right | page | column | avoid-page | avoid-column

break-after: [value];

• autoAllows, meaning neither forbid nor force, any break (either page, column or region) to be be inserted after the principal box.
• alwaysA page/column/region break is inserted (forced) after the content block.
• leftForce one or two page breaks right after the principal box so that the next page is formatted as a left page.
• rightForce one or two page breaks right after the principal box so that the next page is formatted as a right page.
• rectoForce one or two page breaks right after the principal box so that next page is formatted as a recto page, that is a right page in a left-to-right spread or a left page in a right-to-left spread.
• versoForce one or two page breaks right after the principal box so that next page is formatted as a verso page, that is a left page in a left-to-right spread or a left right in a right-to-left spread.
• pageAlways force one page break right after the principal box.
• columnAlways force one column break right after the principal box.
• regionAlways force one region break right after the principal box.
• avoidPrevent any break, either page, column or region, to be inserted right after the principal box.
• avoid-pageAvoid any page break right after the principal box.
• avoid-columnAvoid any column break right after the principal box.
• avoid-regionAvoid any region break right after the principal box.
• inherit

.class {
   break-after: avoid;
}

?

10+

?

?

11.1+

• Share on Facebook
• Share on Twitter
• Share on Google+