SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Evangelist
    Join Date
    Aug 2005
    Posts
    574
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Creating page breaks in wkhtmltopdf

    We're using wkhtmltopdf to convert some of our HTML pages to PDFs. wkhtmltopdf doesn't give much control over where the pages break resulting in some rather nasty-looking page breaks like in the image:

    nastyPageBreak.png

    I had hoped to fix it with something like this:

    Code:
    @media print
    {
    #manualContent h2 {page-break-before:always;}
    }
    However, that's not doing a thing. Does anyone know how to do this? We're doing a 200+ page manual that will be updated fairly frequently so to try to catch the bad page breaks and change the HTML by hand before creating the PDF each time isn't really feasible.

  2. #2
    Mouse catcher silver trophy Stevie D's Avatar
    Join Date
    Mar 2006
    Location
    Yorkshire, UK
    Posts
    5,881
    Mentioned
    122 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by tryin_to_learn View Post
    We're using wkhtmltopdf to convert some of our HTML pages to PDFs. wkhtmltopdf doesn't give much control over where the pages break resulting in some rather nasty-looking page breaks like in the image:

    I had hoped to fix it with something like this:

    Code:
    @media print
    {
    #manualContent h2 {page-break-before:always;}
    }
    However, that's not doing a thing. Does anyone know how to do this? We're doing a 200+ page manual that will be updated fairly frequently so to try to catch the bad page breaks and change the HTML by hand before creating the PDF each time isn't really feasible.
    Assuming that you've got the selectors right, that should be doing the trick. Although a better plan might be to have
    #manualContent .keeptogether {page-break-inside:avoid;}
    as well, and you can then put class="keeptogether" on any element that you don't want to be split over two pages, rather than relying on the h2s falling in the right place.

    As far as I can tell, wkhtmltopdf is based on Webkit, which seems to obey page-break commands pretty well – it respects table {page-break-inside:avoid;}, which Firefox and IE don't. There's a thread on their help pages about page breaks: http://code.google.com/p/wkhtmltopdf/issues/detail?id=9. It looks as though if you have any floats going on then that could be what is stuffing it up, and I'm guessing from your attachment that you do.

    As a general rule, floats and page breaks go together about as well as caviar and custard. Try to avoid having floats on the printed page if possible!

  3. #3
    SitePoint Evangelist
    Join Date
    Aug 2005
    Posts
    574
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ok, thanks for the tips. I'll clean up my HTML and try again.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •