CODEWITHSUNDEEP
phpcssmpdf
pixx
pixx

Reputation: 107

Can't get to work css-borders in mpdf

i'm trying to export a data-table with mpdf and cannot get to work css-borders, i already tried a lot of things...

I also tried to apply borders for testing on a heading in this simple example: 

<?php
require_once('vendor/autoload.php');
ob_start();
?>
<!DOCTYPE html>
<html>
    <head>
        <title>test</title>
        <style type="text/css">
        @media(print)
        {
            h1
            {
                font-size: 16px;
                box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,1);
            }

            table
            {
                width: 100%;
                font-size: 13px;
                border: none;
            }

            td
            {
                border: 1px black solid;
                box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,1);
            }
        }
        </style>
    </head>
    <body>
        <h1>
            Headline
        </h1>
        <table>
            <tr>
                <td>blabla</td>
                <td>blabla</td>
                <td>blabla</td>
            </tr>
        </table>
    </body>
</html>
<?php
$content = ob_get_clean();
$mpdf = new \Mpdf\Mpdf();
$mpdf->SetHTMLFooter('<div class="footer"><span class="pagenum">Seite: {PAGENO} / {nbpg}</span></div>');
$mpdf->WriteHTML($content);
$mpdf->Output();

I also tried to put the css into a external stylesheet or apply it inline, but no success..
(Latest mpdf version installed via Composer)
The strange thing tough is that the font-size and background-styles are being applied o.O

Is there anything i missed?

Update:
I've updated the code, tried to apply box-shadows too, they are applied to the h1, but not the td-elements.. also it seems not a really clean solution for tables...

Upvotes: 1

Views: 10840

Answers (2)

H. M..
H. M..

Reputation: 659

So far as I am dropping some lines, there is still something wrong with MPDF when dealing with table borders. When you style <td> and add border there, what you can see in the output is just border left and border right, and no border top and border down. For me, so as to bypass the problem, I styled both <tr> and <td> to get all the borders, that is the top, bottom, right, and left borders. I just shared my solution in case someone would find it useful.

table td, table th, table tr {
border: 1px solid #c9c9c9 !important
}

Upvotes: 1

Finwe
Finwe

Reputation: 6755

Correct CSS border definition as per specificaton is <br-width> || <br-style> || <color>

Code works as expected in mPDF when the CSS definition is 

td {
  border: 1px solid black;
}

https://developer.mozilla.org/en-US/docs/Web/CSS/border

Upvotes: 4

Related Questions