Search code examples
phphtmlcsshtml2pdf

HTML2PDF unexpected line-breaks within table


I'm using HTML2PDF to generate a pdf-file out of a HTML string.

Everything nice and easy, till I came to a very wierd bug. There is a pagebreak in the middle of a td. Not only does it not take the css with him, but the spot on where it decides to break makes no sence. The sentence is shorter than the sentence above it, while the sentence above only takes up 1 row. Which would mean the sentence with a break would be on just on line, instead, it dicides to use 4 lines. This might sound confusing, so here is an example of the html.

<table>
    <tr>
        <td>Some text longer than the text below.</td>
        <th>Apples</th>
    </tr>
    <tr>
        <td>Text shorter than text above</td>
        <th>Bananas</th>
    </tr>
</table>

As you can see, the first td is longer than the second td, so you'd think if the second td would need a line break, the first one needs one to. Unfortunately, html2pdf decides the second td needs 3 line breaks, while the first has none.

This bugs out the tablerow below it, in which the th overlaps the td in every row.

I have looked trough the code and I can say for sure: This is the html. No page breaks, nothing.

Here is kinda what it would look like if I were to write the output in html. This is not the actual html given to the pdf! This is just the output, written in html.

<table>
    <tr>
        <td>Some text longer than the text below.</td>
        <th>Apples</th>
    </tr>
    <tr>
        <td>Text shorter <br>than <br>text <br>above</td>
        <th>Bananas</th>
    </tr>
</table>

Notes:

  1. This table is on the bottom of my page, so the line breaks causes a very bugged page-break.
  2. I have tried using page-break-inside: avoid; on every element (even on the same time) but nothing seems to work.

Solution

  • I've found the answer. Apparantly, thead and tfoot aren't supported within html2pdf. Html2pdf puts a table in a array and didn't count tfoot and thead in it, but did output it.

    What he does is this. You have this code:

    <table>
        <thead>
            header
        </thead>
        <tr>
            <td>Some text longer than the text below.</td>
            <th>Apples</th>
        </tr>
        <tr>
            <td>Text shorter <br>than <br>text <br>above</td>
            <th>Bananas</th>
        </tr>
        <tfoot>
            footer
        </tfoot>
    </table>
    

    He placed every row in a array, like this:

    array (
    0 => array (
        0 => "thead"
        1 => ""
    1 => array (
        0 => "Some text longer than the text below."
        1 => "Apples"
    2 => array (
        0 => "Text shorter than text above"
        1 => "Bananas"
    3 => array (
        0 => "footer"
        1 => "")
    

    Yet, he'd see only 2 rows, so counted 0 and 1. Which ment he'd output array(0) and array(1). After that, he'd find the rest of the table and just post it as if it's nothing more then a string with tags, while in reality it was a tablerow.

    I could be wrong with the explanation, this is just how I picked it up.