Reputation: 171
Below is part of my html
where I put the page-break-after:always
but when creating a pdf file, the page break does not work.
CSS
@media print {
.encounter_form { position:relative; z-index: 0; left:0px; top:opx; }
}
div#page_break{ page-break-after:always;}
HTML
<div class='text encounter' style='margin:0px 0 0 0; padding:0px 0 0 0; border-style:dotted; border-color:white;'>
<h1>THIS IS A HEADER</h1>
<table>
<tr><td>
<span> </span><span class=text><br>
<span> </span><span class=text><br>
</td></tr>
</table>
<DIV id='page_break' style='page-break-after:always;'></DIV>
</div>
<div class='text encounter_form' style='margin:0px 0 0 0; padding:0px 0 0 0; border-style:dotted; border-color:white;'>
<h1>Work Status Report</h1>
<br>
<div style='margin:5px 0 0 0; padding: 0px 0 0 0; border thin black solid;'>
<table cellpadding='2' cellspacing='0'>
<tr><td>blabla</td></tr>
<tr><td>blabla</td></tr>
<tr><td>blabla</td></tr>
<tr><td>blabla</td></tr>
</table>
<DIV id='page_break' style='page-break-after:always;'></DIV>
</div>
Upvotes: 2
Views: 775
Reputation: 3075
I realise that this question is old, but maybe it'll help someone anyways...
I've noticed that the author inserted empty div to break the page, but won't work because "This properties applies to block elements that generate a box. It won't apply on an empty that won't generate a box." Mozilla reference.
I see two possible solutions here:
1) add CSS page-break-after property on parent div:
.encounter, .encounter_form {
page-break-after: always;
}
and remove those elements with id='page_break' completely:
<DIV id='page_break' style='page-break-after:always;'></DIV>
By the way ids should be unique, but here there are two elements with the same id.
2) insert &nbps; inside empty div (not recommended)
Upvotes: 1