Jump to content

Css in Pdf not working.


Recommended Posts


Surfing al the web and trying many different things, but i dont get it right to my PDF.

We are creating product price tags for the store with barcode.
When look at preview in the popup its shows how we wanted.

But when convert to PDF for print in A4 it shows total different.

Padding dont work, radius, float, -webkit etc dont work in pdf.

Barcode CSS i use:

.column1 {
    float: left;
    width: 48%;
	border:#999 dashed 1px;
	margin: 3px;

.column2 {
    float: right;
    width: 48%;
	border:#999 dashed 1px;
	margin: 3px;

.row { 
    padding-top: 5px;
	margin-left: 10px;
	margin-right: 10px


/* Clear floats after the columns */
.row:after {
    content: "";
    display: table;
    clear: both;

body {
  background: #fff; 
page {
  background: white;
  display: block;
  margin: 0 auto;
  margin-bottom: 0.5cm;
  box-shadow: 0 0 0.5cm rgba(0,0,0,0.5);
page[size="A4"] {  
  width: 21cm;
  height: 29.7cm; 

@media print {
  body, page {
    max-width: 100%;

.itemsku {
    color: #000;
    font-size: 8px;
    font-family: "Arial Black", Gadget, sans-serif;
    text-align: left;
    font-weight: bold;
    padding-left: 25px;
.itemprice {
    border-radius: 6px; 
    font-size: 25px;
    color: #000000;
    font-weight: bold;
    text-align: center;
    font-family: "Times New Roman", Times, serif;
    float: left;

.itemname {
    color: #000;
    font-size: 12px;
    font-family: Arial, Helvetica, sans-serif;
    text-align: left;


My pdf code:

		$html = '


		$html .='
		<page size="A4"><div class="row">';

		foreach ($barcodes as $key => $value) {
			if ($key % 2 == 0) {
				$class = 'column1';
			} else {
				$class = 'column2';
			$html .= '
			<div class="col-md-6 '.$class.'">
				<span class="itemname">'.$barcodes[$key]['name'].'</span><br />
				<span class="itemprice">'.add_currency(format_number($barcodes[$key]['price'])).'</span>
				<img style="float: right;" src="./uploads/barcode/'.$barcodes[$key]['img'].'" width="35%" alt="" /><br />
				<span class="itemsku">'.$barcodes[$key]['sku'].'</span>
		$html .='


		require_once(APPPATH . 'third_party/Mpdf60/mpdf.php');

		$mpdf=new mPDF('c','A4','','',20,15,48,25,10,10);


		// LOAD a stylesheet
		$stylesheet = file_get_contents('oc_contents/theme/css/barcode.css');
		$mpdf->WriteHTML($stylesheet,1); // The parameter 1 tells that this is css/style only and no body/html/text

		$mpdf->Output('./uploads/printbarcode/'.$data['filename'].'.pdf', 'F');
		echo json_encode(array('success' => 1));

What i doing wrong, sombody can help me please.



Link to comment
Share on other sites

  • 1 month later...

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Create New...