6

I've been trying for a while now to create a pdf of a bootstrap page with mpdf and not lose table and other styling. From what I've read on mpdf site is that the styles I'm referring to are supported, so not sure what the problem is. Other styling is being applied. Just not these table classes.

Tables have these classes: " table table-striped table-responsive small "

Bootstrap 3.3.1 and mPDF 5.7 & 6

The page displays as intended in browsers, but the pdf is stripped of table styling, and it's causing readability issues.

I've tried removing the @print from bootstrap.min.css as mentioned here: https://stackoverflow.com/a/27299382/1181367 but makes no difference.

Thanks in advance for any input you offer.

Community
  • 1
  • 1
Chris
  • 893
  • 10
  • 23

2 Answers2

1

For striping the table you can use the following css.

 <style>
    tr:nth-child(even) {
    background-color: #f2f2f2;
}
  </style>
Udit
  • 129
  • 2
  • 6
0

I had facing this issue when i generate invoice using mpdf. it could not apply css given in .css file or in tag. but display format properly in browser whichever i set .

so i tried to give css as inline like :

<div style="display:block;color:#000;"></div>

And it works and solve my problem.

secondly this method also help you:

$mpdf=new mPDF();
$stylesheet = file_get_contents('stylesheet.css'); // external css
$mpdf->WriteHTML($stylesheet,1);
$mpdf->WriteHTML($html,2); //$html contain your html code to display in pdf.
$mpdf->Output();
Nidhi
  • 1,529
  • 18
  • 28