I'm making a HTML report that is going to be printable, and it has "sections" that should start in a new page.
Is there any way to put something in the HTML/CSS that will signal to the browser that it needs to force a page break (start a new page) at that point?
I don't need this to work in every browser out there, I think I can tell people to use a specific set of browsers in order to print this.
Add a CSS class called "pagebreak" (or "pb"), like so:
.pagebreak { page-break-before: always; } /* page-break-after works, as well */
Then add an empty DIV tag (or any block element that generates a box) where you want the page break.
<div class="pagebreak"> </div>
It won't show up on the page, but will break up the page when printing.
Try this link
<style>
@media print
{
h1 {page-break-before:always}
}
</style>
You can use the CSS property page-break-before
(or page-break-after
). Just set page-break-before: always
on those block-level elements (e.g., heading, div
, p
, or table
elements) that should start on a new line.
For example, to cause a line break before any 2nd level heading and before any element in class newpage
(e.g., <div class=newpage>
...), you would use
h2, .newpage { page-break-before: always }
@Chris Doggett makes perfect sense.
Although, I found one funny trick on lvsys.com, and it actually works on firefox and chrome. Just put this comment anywhere you want the page-break to be inserted. You can also replace the <p>
tag with any block element.
<p><!-- pagebreak --></p>