DomPDF Not Rendering Position CSS Correctly in Laravel

56 Views Asked by At

I am currently using DomPDF in laravel to create pdf from view/HTML. The thing is I am using position:relative on my parent element, So I can place my inner elements on exact position. Below is my HTML code in view file

<div style="position:relative">
<div>
  {!! $content !!}
</div>
@foreach($elements AS $element)
  <div style="position: absolute;top: {{$element->top}}; left : {{$element->left}}; width: {{$element->w}}; height : {{$element->h}};">
     <div>
        <div>
            @if($element->type == 'image')
               <img src="{{$element->data}}" alt="">
            @else
               {{$element->data}}
            @endif
        </div>
    </div>
 </div>
@endforeach
</div>

Where $content is my html content which I am getting from DB & $elements is my array in which I have multiple elements with data, type, height, width, top & left. And below is my controller's code:

$pdf = App::make('dompdf.wrapper');
$html = view()->make('view_name', $data)
        ->render();
$pdf->loadHTML($html);

If I render my html all is ok but when I download the PDF elements were not on their coordinates. Kindly let me know what I am mistaking.

0

There are 0 best solutions below