HTML Rendering with TCPDF(PHP)

Question

I am using TCPDF's writeHtml function for a page that renders properly in the browser. In the output PDF, the fonts are too small. I've tried with setFont, but it doesn't seem to have an effect. Does anyone have experience with this?

I'd like to add here that the HTML is not always in my control, so I would prefer to do this with TCPDF options(and not by modifying the source html)

UPDATE: I am able to change the font size by setting it on the body. The only remaining problem is that, to render correctly in the browser, it needs to be 12px. To render correctly in the PDF, it needs be something like 30px. Do I set the media on the css? What is the media type for TCPDF?

Which kind of unit of measurement do you use in your CSS? em, px, %, pt? — entropid, Jan 24 '12 at 16:25
To set the font? Nothing. I'm just using the default. It renders fine on the browser but too small on TCPDF. — navjotk, Jan 24 '12 at 16:29
That could be the problem, try to set a `font-size` in the body CSS declaration. — entropid, Jan 24 '12 at 16:32

score 4 · Accepted Answer · 2012-01-24T16:47:30.623

4

Are you using tags? tcpdf's HTML engine gives the tag precedence over any CSS, or other size-adjusting tags. If you remove any extraneous tags from the HTML and use straight CSS, things should render as expected. Or, if you aren't using CSS, you should. Just because a browser displays it correctly doesn't mean it will look the same on other formats. The browser has likely performed some magic of its own to fill in the gaps in your CSS specifications.

UPDATE

Here's an example of specifying CSS declarations with your HTML when using tcpdf. Note how all the styling is applied using the CSS declarations inside the <style> tag outside the actualy HTML body.

<?php

$html = <<<EOF
<!-- EXAMPLE OF CSS STYLE -->
<style>
  h1 {
    color: navy;
    font-family: times;
    font-size: 24pt;
    text-decoration: underline;
  }
  p {
    color: red;
    font-family: helvetica;
    font-size: 12pt;
  }
</style>
<body>
<h1>Example of <i>HTML + CSS</i></h1>
<p>Example of 12pt styled paragraph.</p>
</body>
EOF;

$pdf->writeHTML($html, true, false, true, false, '');

?>

edited Jan 24 '12 at 16:47

answered Jan 24 '12 at 16:27

What exactly do you mean? Are you asking me if I define the font size somewhere in the HTML attributes? No. How can I remove all the tags from the HTML? – navjotk Jan 24 '12 at 16:32
1

Some people still erroneously resort to things like `` tags. What I'm saying is that you should specify **all** the display logic of your markup using CSS. Make sure you explicitly tell tcpdf what size you want things to display, like `body { font-size: large; }` or `p { font-size: 2em; }` – Jan 24 '12 at 16:35
Can I do this with TCPDF parameters somehow? I don't want to mess with the source HTML as this might be adapted to work with 3rd party HTML as well. Can I add some styles seperately, using TCPDF? – navjotk Jan 24 '12 at 16:38
1

Yes, simply declare the style declarations at the beginning of the html -- it's not a best practice to specify HTML inline CSS declarations anyway. I'll update the answer to demonstrate. – Jan 24 '12 at 16:42
I wasn't aware you could specify the CSS on TCPDF's `writeHTML()`. It isn't even mentioned on the documentation. This answer was of GREAT help, thank you a lot! – That Brazilian Guy Aug 13 '13 at 18:48

score 1 · Answer 2 · answered Jun 20 '13 at 07:00

1

The best solution that worked for me was to replace 'px' to 'pt' in html code:

$tidy = str_replace ('px', 'pt', $tidy);

Before on the left side and after replacing on the right:

answered Jun 20 '13 at 07:00

Andrius V.

134
1
8

1

This is a horrible solution. PDF writers use "pt, mm or inch" for a very good reason. Pixels are fixed-size units that are used in screen media (i.e. to be read on the computer screen). Pixel stands for "picture element" and as you know, one pixel is one little "square" on your screen. Points are traditionally used in print media (anything that is to be printed on paper, etc.). One point is equal to 1/72 of an inch. Points are much like pixels, in that they are fixed-size units and cannot scale in size. – Jul 13 '15 at 12:33

score 0 · Answer 3 · edited May 23 '17 at 12:22

0

TCPDF recognizes basic CSS such as font-size, font-color, and font-family.

For a little more information, check out TCPDF not render all CSS properties

edited May 23 '17 at 12:22

Community

1
1

answered Jan 24 '12 at 16:24

Jeremy Harris

24,318
13
79
133

The problem is that the HTML will not always be in my control. Isn't there some way I can do this outside of the document? Maybe pass some CSS along with the HTML? – navjotk Jan 24 '12 at 16:33

HTML Rendering with TCPDF(PHP)

3 Answers3

Linked