wkhtmltopdf with full page background

34
votes

I am using wkhtmltopdf to generate a PDF file that is going to a printer and have some troubles with making the content fill up an entire page in the resulting PDF.

In the CSS I've set the width and height to 2480 X 3508 pixels (a4 300 dpi) and when creating the PDF I use 0 for margins but still end up with a small white border to the right and bottom. Also tried to use mm and percentage but with the same result.

I'd need someone to please provide an example on how to style the HTML and what options to use at command line so that the resulting PDF pages fill out the entire background. One way might be to include bleeding (this might be necessary anyway) but any tips are welcome. At the moment I am creating one big HTML page (without CSS page breaks - might help?) but if needed it would be fine to generate each page separately and then feed them all to wkhtmltopdf.

7
wkhtmltopdf
hi, did you manage to fix this problem? – user961627

7 Answers

45
votes

wkhtmltopdf v 0.11.0 rc2

What ended up working:

wkhtmltopdf --margin-top 0 --margin-bottom 0 --margin-left 0 --margin-right 0 <url> <output>

shortens to 

wkhtmltopdf -T 0 -B 0 -L 0 -R 0 <url> <output>

Using html from stdin (Note dash)

echo "<h1>Testing Some Html</h2>" | wkhtmltopdf -T 0 -B 0 -L 0 -R 0 - <output>

Using html from stdin to stdout

echo "Testing Some Html" | wkhtmltopdf -T 0 -B 0 -L 0 -R 0 - test.pdf

echo "Testing Some Html" | wkhtmltopdf -T 0 -B 0 -L 0 -R 0 - - > test.pdf

What did not work:

  • Using --dpi
  • Using --page-width and --page-height
  • Using --zoom
10
votes

I realize this is old and cold, but just in case someone finds this and has the same/similar problem, here's a workaround that worked for me after some trial&error.

I created a simple filler.html as:

<!DOCTYPE html>
<html>
<head>
</head>
<body style="margin: 0; padding: 0;">
<div style="height: 30mm; background-color: #F7EBD4;">
&nbsp;
</div>
</body>
</html>

Use valid HTML (!DOCTYPE is important) and only inline styles. Match the background color to that of the main document and use height equal or bigger than your margins.

I run version 0.12.0 with the following arguments:

wkhtmltopdf --print-media-type --orientation portrait --page-size A4
 --encoding UTF-8 --T 10mm --B 10mm --L 0mm --R 0mm
 --header-html filler.html --footer-html filler.html - - <file.html >file.pdf

Hoping this helps someone...

8
votes

We just solved the same problem by using the --disable-smart-shrinking option.

7
votes

At http://code.google.com/p/wkhtmltopdf/issues/detail?id=359 I found out more people 'suffer' from this bug. The --dpi 300 workaround did not work for me, I had to set --zoom 1.045 to zoom in a bit which made the extra right and bottom border disappear...

6
votes

Works fine for me with -B 0 -L 0 -R 0 -T 0 options and using your trick of setting up an A4 sized div.

Did you remember to use body {margin:0; padding:0;} in the top of your CSS?

I cannot help you with CSS page breaks as I have not trialled an errored those yet, however, you can run scripts on the page to do clever things. Here is a jQuery example of how to split content down into page size chunks based on the length of the content. If you can get that adapted to work with wkhtmltopdf then please post here!

http://www.script-tutorials.com/demos/79/index.html

6
votes

I'm using version 0.12.2.1 and setting:

body { padding: 0; margin 0; }
div.page-layout { height: 295.5mm; width: 209mm;}

worked for me.

Of course need to add 0 margins by:

wkhtmltopdf -T 0 -B 0 -L 0 -R 0
2
votes

What you are experiencing is a bug.

You'll need to set the --dpi option when converting the file. In you case you will probably want --dpi 300, but that can be set lower.