Printing HTML with Page Breaks

A common need for a web developer is to be able to design a web page that is intended to be printed by an end-user. Printing through the web browser’s “print” button or the JavaScript window.print feature is not too difficult, particular with the CSS properties: “page-break-before” and “page-break-after“.

div {
  page-break-before: always;
}

OR

div {
  page-break-after: always;
}

[quotes_right]
Here are some references:

[/quotes_right]

Here are the property options:

Value Description
auto Default. Insert a page break after the element if necessary
always Insert a page break after the element
avoid Avoid inserting a page break after the element
left Insert page breaks after the element until it reaches a blank left page
right Insert page breaks after the element until it reaches a blank right page
inherit Specifies that the value of the page-break-after property should be inherited from the parent element

(table content from w3schools.com)

NOTE: Keep in mind that if you have the page-break-after: always; set on a page element, even if nothing follows it on that particular page, there will always be a second page printed each time you print. If you want to stop that second page from always printing, use the page-break-before: always; property instead. Use that property any place you want the new page to START.