TCPDF not render all CSS properties

六眼飞鱼酱① 提交于 2019-11-27 20:00:46
Álvaro González

In the first place, you should note that PDF and HTML and different formats that hardly have anything in common. If TCPDF allows you to provide input data using HTML and CSS it's because it implements a simple parser for these two languages and tries to figure out how to translate that into PDF. So it's logical that TCPDF only supports a little subset of the HTML and CSS specification and, even in supported stuff, it's probably not as perfect as in first class web browsers.

Said that, the question is: what's supported and what's not? The documentation basically skips the issue and let's you enjoy the trial and error method.

Having a look at the source code, we can see there's a protected method called TCPDF::getHtmlDomArray() that, among other things, parses CSS declarations. I can see stuff like font-family, list-style-type or text-indent but there's no margin or padding as far as I can see and, definitively, there's no float at all.

To sum up: with TCPDF, you can use CSS for some basic formatting. If you need to convert from HTML to PDF, it's the wrong tool. (If that's the case, may I suggest wkhtmltopdf?)

TCPDF 5.9.010 (2010-10-27) - Support for CSS properties 'border-spacing' and 'padding' for tables were added.

Rajkumar

Supported tags are: a, b, blockquote, br, dd, del, div, dl, dt, em, font, h1, h2, h3, h4, h5, h6, hr, i, img, li, ol, p, pre, small, span, strong, sub, sup, table, tcpdf, td, th, thead, tr, tt, u, ul

All the HTML attributes must be enclosed in double-quotes

dschnizzy

I recently ran into the same problem having the TCPDF work with my CSS. Take a look at the code below. It worked for me after I changed the standard CSS to a format PHP would understand

Code Sample Below

$table = '<table width="100%" cellspacing="0" cellpadding="55%">
          <tr valign="bottom">
                <td class="header1" rowspan="2" align="center" valign="middle"
                      width="6%">Category</td>
                <td class="header1" rowspan="2" align="center" valign="middle"
                      width="26%">Project Description</td>
          </tr></table>';

At the moment I write this, TCPDF only supports padding for tables.

Link to their forum page with that information

TCPDF 6.2.11 (2015-08-02)

Some things won't work when included within <style> tags, however they will if added in a style="" attribute in the HTML tag. E.g. table padding – this doesn't work:

table {
    padding: 5px;
}

This does:

<table style="padding: 5px;">

Since version 5.7 TCPDF includes support for CSS borders. Margins, padding and float are not yet supported. Check the TCPDF website at http://www.tcpdf.org and consult the official forum for further information.

I recently ran into the same problem, and found a workaround though it'll only be useful if you can change the html code to suit.

I used tables to achieve my padded layout, so to create the equivalent of a div with internal padding I made a table with 3 columns/3 rows and put the content in the centre row/column. The first and last columns/rows are used for the padding.

eg.

<table>
<tr>
    <td width="10">&nbsp;</td>
    <td>&nbsp;</td>
    <td width="10">&nbsp;</td>
</tr>
<tr>
    <td>&nbsp;</td>
    <td>content goes here</td>
    <td>&nbsp;</td>
</tr>
<tr>
    <td width="10">&nbsp;</td>
    <td>&nbsp;</td>
    <td width="10">&nbsp;</td>
</tr>
</table>

Hope that helps.

Joe

Just a small tip for setting custom padding without extra table elements. Just use this way, it works (TCPDF 6.2.11)

<table border="0" style="padding-left: 10px; padding-bottom: 15px;">
<tr>
<td style="border: 1px solid grey;"> One two three </td>
<td style="border: 1px solid grey;"> Four five six </td>
</tr>
</table>

Hi there i just wanted to share that i found this:
//Remove tag bottom and top margins

$tagvs = array( 'p' => array( 0 => array('h' => 0, 'n' => 0), 1 => array('h' => 0, 'n' => 0) ) ); $pdf->setHtmlVSpace($tagvs);

in here: https://tcpdf.org/examples/example_061/

and use it to remove 'p' tags properties (bottom and top) then position the 'p' text inside a cell using

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!