HTML tutorial
CSS3 tutorial
Bootstrap tutorial
JavaScript tutorial
JQuery tutorial
AngularJS tutorial
React tutorial
NodeJS tutorial
PHP tutorial
Python tutorial
Python3 tutorial
Django tutorial
Linux tutorial
Docker tutorial
Ruby tutorial
Java tutorial
C tutorial
C ++ tutorial
Perl tutorial
JSP tutorial
Lua tutorial
Scala tutorial
Go tutorial
ASP.NET tutorial
C # tutorial
Always insert a page-break after a <footer> element:
The break-after property specifies whether
or not a page break, column break, or region break should occur after the
specified
element.
The break-after property extends the CSS2
page-break-after property.
Using break-after, you can tell the browser
to break the page, column, or region after the element the break-after
property is applied to, or avoid the element to be split and span across two
pages.
| Default value: | auto |
|---|---|
| Inherited: | no |
| Animatable: | no. Read about animatable |
| Version: | CSS3 |
| JavaScript syntax: | object.style.breakAfter="always" |
The numbers in the table specify the first browser version that fully supports the property.
| Property | |||||
|---|---|---|---|---|---|
| break-after | 50.0 | 10.0 | 65.0 | 10.0 | 37.0 |
| Value | Description |
|---|---|
| auto | Default. Automatic page/column/region break after the element |
| all | Always insert a page-break right after the principal box |
| always | Always insert a page-break after the element |
| avoid | Avoid a page/column/region break after the element |
| avoid-column | Avoid a column-break after the element |
| avoid-page | Avoid a page-break after the element |
| avoid-region | Avoid a region-break after the element |
| column | Always insert a column-break after the element |
| left | Insert one or two page-breaks after the element so that the next page is formatted as a left page |
| page | Always insert a page-break after the element |
| recto | Insert one or two page-breaks after the principal box so that the next page is formatted as a recto page |
| region | Always insert a region-break after the element |
| right | Insert one or two page-breaks after the element so that the next page is formatted as a right page |
| verso | Insert one or two page-breaks after the principal box so that the next page is formatted as a verso page |
| initial | Sets this property to its default value. Read about initial |
| inherit | Inherits this property from its parent element. Read about inherit |
Always insert a page-break after element with id "toc" (table of content):
@media print
{
#toc {
break-after: always;
}
}
Always insert a region-break after <ul> elements in a region:
.region ul {
break-after: region;
}
}