Reputation: 2307
I'm generating a pdf document using dompdf 0.6.0, and have a strange issue where a blank page is being created at the end. My (simplified) html:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>PDF</title>
<style type="text/css">
@page{ margin: 0;}
.page{
width: 612px;
height: 792px;
overflow: hidden;
font-family: Arial, Helvetica;
position: relative;
color: #545554;
page-break-after: always;
}
</style>
</head>
<body>
<div class="page" style="background-image: url(page1.jpg);">
...
</div>
<div class="page" style="background-image: url(page2.jpg);"></div>
<div class="page" style="background-image: url(page3.jpg); color: white;">
...
</div>
</body>
</html>
The first three pages look amazing, but there is a blank page at the end. I've read dompdf is picky about nesting and compliance and such, but the html is super clean and checks out.
Upvotes: 15
Views: 29875
Reputation: 1729
For me it was the <table role="presentation">
Changing it to <table role="doc-pagebreak">
fixed the problem.
Upvotes: 0
Reputation: 50
I did concated the css link at the end of the file, which caused the new page.
Like:
[...] //html with </html>
$html .= "<link>[...]</link>";
Which of course causes a new page, but you have to think about it, maybe this helps someone.
P.S.: I don't have enough reputation yet to write this as a comment
Upvotes: 0
Reputation: 1
For me it was because i had a "min-height: 100%;" in a css file. Remove it for not have the extra blank page.
Upvotes: 0
Reputation: 91
I faced the same problem and resolved by changing the page height from -
min-height: 297 mm to min-height: 290 mm
Upvotes: 0
Reputation: 21
By adding
margin-bottom: -20px;
to the main
or div
tag solved my problem.
Upvotes: 0
Reputation: 53
In my case it occurred because the content was bigger than the paperSet(). If the content pass at least 1px, dompdf automatically creates another sheet. So you always need to set sizes according the paperSet() proportion you set.
For example: Paper A4 is 210mmx297mm. To make it easier, I recommend to use 'mm' instead of 'px'. Then you can create your divs and add their heights summing them all and making sure it is within 297mm.
To know the papers sizes you can see in this site:
Upvotes: 2
Reputation: 97
As Filip Molcik suggested the solution. This is how I implemented this.
$view = view('layouts.qr-pdf');
$html = $view->render();
$html = preg_replace('/>\s+</', "><", $html);
$pdf = PDF::loadHTML($html);
return $pdf->download('asd.pdf');
Upvotes: 0
Reputation: 99
Just remove, body</> and html</> end tag end of the page with extra line space. And I hope you can remove the extra blank page from the pdf.
Upvotes: 2
Reputation:
if you have array variable then set this condition in youtpdfhtml.blade.php
:
@if($key<($total-1))
<div class="page-break"></div>
@endif
Upvotes: 1
Reputation: 1
If you are using an array to store and output your HTML code, and still getting the error, you can remove the last page including page breaks in all pages except the last one, using count() function.
$html='';
$i = 0; //counter
$len = count($output_array);// lenght of the array
foreach($output_array as $output)
{ //store the html in a variable to use it in dompdf
$html.= $output;
if ($i < $len - 1)
{ //if the counter is less than the lenght of the array, add a page break.
$i++;
$html.=' <div class="page_break"></div>';
}
}
Upvotes: 0
Reputation: 1153
This happens because of the css you have written page-break-after: always;
for page
class.
The above style will do a page break after your last page also and dompdf creates a blank page at the end.
Another solution is to write a separate css style for your last page excluding page-break-after: always;
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>PDF</title>
<style type="text/css">
@page{ margin: 0;}
.page{
width: 612px;
height: 792px;
overflow: hidden;
font-family: Arial, Helvetica;
position: relative;
color: #545554;
page-break-after: always;
}
.last-page{
width: 612px;
height: 792px;
overflow: hidden;
font-family: Arial, Helvetica;
position: relative;
color: #545554;
}
</style>
</head>
<body>
<div class="page" style="background-image: url(page1.jpg);">
...
</div>
<div class="page" style="background-image: url(page2.jpg);"></div>
<div class="last-page" style="background-image: url(page3.jpg); color: white;">
...
</div>
</body>
</html>
Happy coding!
Upvotes: 10
Reputation: 1041
For me the fix was to remove any whitespace between tags.
$html = preg_replace('/>\s+</', "><", $html);
Upvotes: 16
Reputation: 2307
Turns out the end </body>
and </html>
tags were causing the extra page. I removed them, and results are as expected.
I'd imagine its a problem with dompdf, but I spent quite awhile trying to solve the issue and figured this might be of help to others.
Update:
As Joe mentions in the comments, moving the </body>
and </html>
tags to the same line as your closing </div>
works, and remains valid html.
Upvotes: 53