Search code examples
laraveldompdf

dompdf is not rendering Table from html in laravel


I'm using dompdf in my laravel project. I'm trying to generate a PDF which contains a table. All data of tables are generating but the table borders are not showing.

But when I'm generating the html in browser it's working properly with 100% width of the table but not getting 100% width in the PDF.

My controller code:

    $users  = $course->users()
                        ->withPivot('section_id')
                        ->wherePivot('section_id', '=', $section->id)
                        ->orderBy('student_id', 'asc')
                        ->get();

    $season = Season::where('is_ended', 0)->first();

    $pdf = PDF::loadView('sections.attendace', compact('users', 'course', 'season', 'section'));

    return $pdf->stream('attendance.pdf');

Blade Code:

        <div class="attendance-table">

            <table class="table-bordered">

                <tr>
                    <th class="attendance-cell">ID</th>
                    <th class="attendance-cell">Name</th>
                    @for($i = 1; $i<=9; $i++)
                        <th class="blank-cell attendance-cell">{{$i}}</th>
                    @endfor
                </tr>

                @foreach($users as $user)
                    <tr>
                        <td class="attendance-cell">{{$user->student_id}}</td>
                        <td class="attendance-cell">{{ucwords($user->name)}}</td>
                        @for($i = 1; $i<=9; $i++)
                            <td class="blank-cell attendance-cell">{{$i}}</td>
                        @endfor
                    </tr>
                @endforeach

            </table>

        </div>

CSS

.attendance-table table{
  width: 100%;
  border-collapse: collapse;
  border: 1px solid #000;
}

.blank-cell{

  min-width: 50px;


}

.attendance-cell{

  padding: 8px;


}

.attendance-table table th.attendance-cell, .attendance-table table td.attendance-cell {
    border: 1px solid #000;
}

Generated PDF

Generated PDF

Generated HTML

Generated HTML

Now, how can I get the borders and how can I get 100% width of the table?


Solution

  • I also had the same problem, so I put the CSS inside the blade itself in the <style> tag.

    DOMPDF does not pull from the .css file.

    Hope this helps!