atonyc
atonyc

Reputation: 2307

dompdf inserts blank page at end of document

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

Answers (13)

Leo Leoncio
Leo Leoncio

Reputation: 1729

For me it was the <table role="presentation"> Changing it to <table role="doc-pagebreak"> fixed the problem.

Upvotes: 0

Johannes Reiter
Johannes Reiter

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

user20658735
user20658735

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

I faced the same problem and resolved by changing the page height from -

min-height: 297 mm to min-height: 290 mm

Upvotes: 0

Than Tun Aung
Than Tun Aung

Reputation: 21

By adding margin-bottom: -20px; to the main or div tag solved my problem.

Upvotes: 0

Fabr&#237;cio Justo
Fabr&#237;cio Justo

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:

https://papersizes.io/

Upvotes: 2

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

Al-Amin
Al-Amin

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

user8661758
user8661758

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

Hoz1982
Hoz1982

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

Michel
Michel

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

Filip Molcik
Filip Molcik

Reputation: 1041

For me the fix was to remove any whitespace between tags.

 $html = preg_replace('/>\s+</', "><", $html);

Upvotes: 16

atonyc
atonyc

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

Related Questions