Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Font kerning issue when rendering to PDF on Ubuntu #11413

antonholmquist opened this issue Jun 17, 2013 · 14 comments

Font kerning issue when rendering to PDF on Ubuntu #11413

antonholmquist opened this issue Jun 17, 2013 · 14 comments


Copy link

@antonholmquist antonholmquist commented Jun 17, 2013

Ubuntu 12.04 LTS
PhantomJS 1.9.1

It happens for all fonts with the same letters combinations rendering completely off. The fonts are Microsoft Core Fonts.

When I render to PNG it renders fine. Also when I run the same code on my Mac it renders fine.

I've tried modifying ~/.fonts.conf according to but it makes no difference.

screen shot 2013-06-17 at 9 33 42 pm

Copy link

@antonholmquist antonholmquist commented Jun 17, 2013

I got the exakt same issue with wkhtmltopdf, so it's not related to PhantomJS.

Copy link

@ariya ariya commented Jun 18, 2013

Looks like a bug or an issue with Qt's PDF engine. I wonder if there's an upstream bug regarding this.

Copy link

@antonholmquist antonholmquist commented Jun 18, 2013

Actually, I do get correct results with wkhtmltopdf now but the problem persists on PhantomJS. Could it be related to the fact that wkhtmltopdf uses the X server while Phantom does not?

I provided some more information here:

Copy link

@billschaller billschaller commented Jul 5, 2013

I have been able to solve this issue by supplying an OTF font replacement using a css @font-face query.

This DOES NOT WORK if it is in a linked stylesheet, or in a @media query within a style tag in the page body.

This only seems to work if the CSS is applied without any media query in a style tag in the page body.

Like so:

<style type="text/css">
        font-family: "Helvetica Neue";
        src: url("css/arial-otf.ttf")

I'm using bootstrap for a site I need to make PDFs from, and by overriding Bootstrap's default of "Helvetica Neue", I can ditch that font and replace it with the Windows system Arial font which I converted to OTF format. It is an otf font, even though it has the ttf extension -- that is just to get around IIS 7 not knowing what a .otf file is.

Copy link

@bazitov bazitov commented Mar 29, 2014

@zeroedin-bill your solution works like charm, but I can't get the bold font-weight working. I can get either everything in bold or regular.

Copy link

@skyrocknroll skyrocknroll commented Sep 4, 2014

Keeping page.zoomFactor = 0.75; solved it for me..

Copy link

@carlosacp carlosacp commented Jan 22, 2016

If some desperate with this problem reach this topic, I was using phantom-html2pdf on linux ubuntu and having this issue. Installing ttf-mscorefonts-installer and migrate to phantomjs 2.0 ( solve the problem

Copy link

@erikverheij erikverheij commented Feb 1, 2016

I had the same issue with phantomjs 2.1.1 and AWS Linux AMI (based on CentOS/RHEL).

This suggestion saved my life; wkhtmltopdf/wkhtmltopdf#45 (comment)

Copy link

@moodysalem moodysalem commented Apr 29, 2016

@erikverheij I'm also having this issue

When you click download PDF, the html of the page is pushed to a server and the server uses phantomjs 2.1.1 to render it.

When you print from the browser it seems to have different kerning than when the server renders to PDF

I tried adding the .conf file to the /etc/fonts/conf.d directory on the EC2 instance but it didn't seem to change anything. Also can't find much information about reloading those files but I did an fc-cache call after that. Every server request starts a new phantomjs process so I'm not sure what I'm doing differently

Copy link

@isuvorov isuvorov commented Jul 20, 2016

I have the same issue
ubuntu, debian from docker image
phantomjs 1.9.2 & 2.1.1

fixed: apt-get install libfontconfig1

Copy link

@abombelli abombelli commented Aug 25, 2016

Has this been solved?
When generating a PDF with SVG fonts kerning is Ok. But the generated file is huge as each letter is vectorized.

Copy link

@notatestuser notatestuser commented Dec 7, 2016

@abombelli Not to mention the viewer is unable to select any text! That fixed my kerning issue though.

Copy link

@olegsfinest olegsfinest commented Mar 8, 2017

I had the same issues and I tend not to believe it but @billschaller 's comment solved it indeed. But I have the same problem like @bazitov, it does not work for several font-faces (for bold, italic etc). Has anyone come to a solution?

@stale stale bot added the stale label Dec 25, 2019
Copy link

@stale stale bot commented Dec 28, 2019

Due to our very limited maintenance capacity (see #14541 for more details), we need to prioritize our development focus on other tasks. Therefore, this issue will be automatically closed. In the future, if we see the need to attend to this issue again, then it will be reopened. Thank you for your contribution!

@stale stale bot closed this as completed Dec 28, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
None yet

No branches or pull requests