Search code examples
phppdftcpdfdompdf

Design error in pdf export - Dompdf/tcpdf


I am developing a travel portal and its essential to make a pdf ticket for the booking. I used Dompdf and tcPdf. But there is design error in exported pdf from both libraries.

This is my actual HTML Design
enter image description here

This is the generated PDF

enter image description here

My HTML Design Code

<table class="col-xs-12 other-table" style="text-align:left">
  <tr>
    <td>TICKET ID</td>
    <td>&nbsp;</td>
    <td><span>LD324865</span></td>
    <td></td>
    <td></td>
    <td></td>
  </tr>
  <tr>
    <td>PACKAGE NAME</td>
    <td>&nbsp;</td>
    <td><span>LAKSHADWEEP SUMMER PACKAGE</span></td>
    <td></td>
    <td></td>
    <td></td>
  </tr>
  <tr>
    <td>DATE OF BOOKING</td>
    <td>&nbsp;</td>
    <td><span>28 May 2016</span></td>
    <td>DATE OF JOURNEY</td>
    <td>&nbsp;</td>
    <td><span>31 May 2016</span></td>
  </tr>
</table>
<style>
.grey-color{
color:#666; 
}
.total-cost{font-size:18px}
.address{
font-size:11px;
}
.heading{
border-bottom:1px #CCCCCC solid;
}
.package-name{
font-size:15px;
margin:15px 0px;
}
.package-name span{
    padding:10px !important;background:#EAEAEA;
}
.table{font-size:14px}
.other-table td{padding: 12px 0px !important;font-size:12px}
.other-table span{background:#EAEAEA;padding:16px !important;}
.uppercase{text-transform:uppercase !important;}

</style>

PHP Code for generating PDF

<?php 
require_once 'dompdf/autoload.inc.php';


// reference the Dompdf namespace
use Dompdf\Dompdf;

// instantiate and use the dompdf class
$dompdf = new Dompdf();
$html = file_get_contents('holiday.html');
$dompdf->loadHtml($html);


// (Optional) Setup the paper size and orientation
$dompdf->setPaper('A4', 'portrait');

// Render the HTML as PDF
$dompdf->render();

// Output the generated PDF to Browser
$dompdf->stream();
?>

How to get a correct pdf design ? I don't want any paid library. Is there any other PHP PDF library to do this ?


Solution

  • dompdf does not currently (up through and inluding 0.7.0) have good support for padding on inline elements. you can switch to a block element (a P or DIV) and see better results.

    With 0.7.0 you can also fix the styling by setting your span display style to inline-block.