CSS break-after property

The break-after property allows you to place a break on multi-region contexts, paged media, and multi-column layouts. This property describes how the region, column, or page break behaves after the generated box. This property is ignored if there is no generated box at all.

Syntax:

break-after: Generic break values;
/* Or */
break-after: Page break values;
/* Or */
break-after: Column break values;
/* Or */
break-after: Region break values;
/* Or */
break-after: Global values;

Property values: This property accepts the property values mentioned above and described below:

• Generic break values: This property refers to the values defined by auto, avoid, always, all, etc.
• Page break values: This property refers to the values defined by page, avoid-page, left, right, recto, verso, etc.
• Column break values: This property refers to the values defined by column, avoid-column, etc.
• Region break values: This property refers to the values defined by region, avoid-region, etc.
• Global values: This property refers to the values defined by inherit, initial, unset, etc.

Example: Below is the example which illustrates the use of break-after property

Output:

Supported Browsers:

• Chrome
• Safari (Partially Supported)
• Opera
• Firefox (Partially Supported)
• Internet Explorer