Wkhtmltopdf Characters in single line partially cut between pages

html ruby-on-rails ruby wkhtmltopdf pdfkit

20,057

Solution 1

I did have this problem with a table:

enter image description here

Then I added this to my CSS:

table, img, blockquote {page-break-inside: avoid;}

This fixed the problem:

enter image description here

Solution 2

I just ran across this and found something that resolved the issue for me. In my particular case, there were divs with display: inline-block; margin-bottom: -20px;. Once I changed them to block and reset the margin-bottom, the line splitting disappeared. YMMV.

Solution 3

According to some documentation I found (see Page Breaking), this is a known issue and suggests using CSS page breaks to insert page breaks (assuming you are using patched version of QT):

The current page breaking algorithm of WebKit leaves much to be desired. Basically webkit will render everything into one long page, and then cut it up into pages. This means that if you have two columns of text where one is vertically shifted by half a line. Then webkit will cut a line into to pieces display the top half on one page. And the bottom half on another page. It will also break image in two and so on. If you are using the patched version of QT you can use the CSS page-break-inside property to remedy this somewhat. There is no easy solution to this problem, until this is solved try organising your HTML documents such that it contains many lines on which pages can be cut cleanly.

See also: http://code.google.com/p/wkhtmltopdf/issues/detail?id=9, http://code.google.com/p/wkhtmltopdf/issues/detail?id=33 and http://code.google.com/p/wkhtmltopdf/issues/detail?id=57.

Solution 4

In my case, the issue was resolved by commenting out the following css:

html, body {
  overflow-x: hidden;
}

In general, check if any tags have overflow set as hidden and remove it or set it to visible.

Btw, I am using wkhtmltopdf version 0.12.2.1 on Windows 8.

Solution 5

https://github.com/ArthurHub/HTML-Renderer/issues/38

                    **var head = "<head><style type=\"text/css\"> td, h1, h2, h3, p, b, div, i, span, label, ul, li, tr, table { page-break-inside: avoid; } </style></head>";**

                    PdfDocument pdf = PdfGenerator.GeneratePdf("html>" + head + "<body>" +  m42Notes + "</body></html>", configurationOptions);

View more solutions

20,057

amexn

Updated on July 09, 2022

Comments

amexn almost 2 years

I am working in a project using ruby on rails(3.1). My requirement is to produce pdf from the html content. So I use pdfkit gem.

In some pages, characters in single line partially cut between pages. When I convert html convert to pdf using pdfkit gem

version of wkhtmltopdf: wkhtmltopdf -- 0.11.0 rc1

operating system: Linux CentOS 5.5

In the image below showing character partially cut between pages.

Please suggest a solution.

Example 1

Example 2
- Christopher Manning over 12 years
  
  What is the full command you are using to generate the pdf?
- amexn over 12 years
  
  Command generated from pdfkit gem: wkhtmltopdf "--page-size" "A4" "--margin-top" "5mm" "--margin-right" "5mm" "--margin-bottom" "5mm" "--margin-left" "5mm" "--encoding" "UTF-8" "--quiet" "1011284.html" "test.pdf"
- Matt over 12 years
  
  what happens if you change the margin? does it still cut it off?
- amexn over 12 years
  
  Showing same error after changing the margin
- rrr_2010 about 5 years
  
  * { page-break-inside: avoid; page-break-after: avoid; page-break-before: avoid; }
nils over 11 years

Thank you, I had the same problem with an "article" element. After adding display: block, it worked like a charm.
usha almost 11 years

@nvahalik: To which element did you add display:block? i have a similar issue with exporting table in pdf. SO question here - stackoverflow.com/questions/17046385/…
rageandqq over 9 years

I'm using 0.12.2.1, which is a more updated version of wkhtmltopdf. I still seem to have this problem, so I don't think this is the fix (since I doubt they reintroduced the bug in a newer version).
Dragos Rusu over 9 years

I confirm 0.12.1 worked at the moment - didn't play with it since.
craned about 9 years

This no longer the case. The answer below by @Besi resolves any page break issues, not to mention just getting the latest version of wkhtmltopdf (0.12.2.1). Add the following to your CSS: table, img, blockquote {page-break-inside: avoid;}
Amichai Schreiber about 8 years

This didn't work for me. I tried settings this attribute on enclosing td, tr and div and line is still cropped.
Neel over 7 years

@craned not right. The problem is only partially solved and its still there. The page-break-inside will only help for the whole block you are adding it to. For example, if 1 paragraph / block is more than a page long, then page-break-inside will not help and the text will be cut in some cases. Its okay to fix it if it is static text, but it is a problem with dynamically generated text when you dont know how long that particular block will be. So the problem is still there and only partially resolved.
craned over 7 years

@Neel, in that case I'd say it's mostly solved. At least in my particular scenario, 1 paragraph/block was never going to be a problem. Quite frankly, a paragraph/block should never be longer than a normal page, but in what seems like the rare case that it is, then yes, that would be a place where the problem still exists.
Alesis Joan almost 7 years

Using wkhtmltopdf 0.12.2.1 (with patched qt), still the issue.
Krishna Prasad Varma about 5 years

Am using 0.12.5.0 (patched QT) and it is still breaking for me.
Geralt43 almost 3 years

re-installing fonts on my ubuntu fixed the fonts issue.
Michael Ghorb over 2 years

Resolved my problem.