dimanche 5 juillet 2020

Problem with height of generated with html2pdf pdf file

In my laravel 5.7 / bootstrap 4.4 app I use spatie/browsershot 3.37 and spipu/html2pdf 5.2 to generate pdf file and I have a problem with content layout: I need to make a standard 216 x 279 mm Portrait Layout

I make bootstrap code in my blade page and I show page layout in 100% height on the page and by clicking on “To pdf file” content of the page is rendered into pdf file:

Browsershot::html(htmlspecialchars_decode($pdf_content))
           ->showBackground()
           ->save($save_to_file);

if($hidden_action== 'upload') {
    \Response::download($save_to_file, $filename_to_save, array('Content-Type: application/octet-stream', 'Content-Length: pdf'));
    return response()->download($save_to_file, $filename_to_save)->deleteFileAfterSend(true);
}

In blade file I set layout with parameters :

<div class="card" style="min-width: 1100px; border:4px solid blue; display: flex;
    height: 842pt !important;
    width: 595pt !important;
    flex-direction: column;

    justify-content: flex-start;
    align-items: stretch;
    align-content: stretch; 

    background-color: chocolate;
    "
     id="div_invoice_content">

    <div class="col-sm-12 card-body" style=" border: 2px solid red; display: flex; flex: 1;">

        <div class="card-title">

            <ul  style="        display: flex;
        list-style-type: none;
    border: 3px dotted maroon;
        width: 100%;
        justify-items: flex-start;
        padding:0 ;
        margin:0 ;
">
...


    <div class="card-footer" style="border: 2px solid yellow;">
        <table style="width:100%;  ">
        <tr>
            <td style="width:100%; border:0; border: 8px solid #c1c1c1; margin: 0; padding: 0; margin-top: 4px;" colspan="3">
                <table style="width:100%;  ">
                    <tr>
                        <td style="width:30%; ; font-size:  !important;
                            color:;">
                            Printed on: 
                        </td>
                        <td style="width:20%; ; font-size:  !important;
                            color:;" >
                            Page 1 of 1
                        </td>
                        <td style="width:50%; ; font-size:  !important;
                            color:;" >
                            
                        </td>
                    </tr>
                </table>
            </td>
        </tr>
        </table>
    </div>

</div> <!-- div_invoice_content -->

As result in a browser I see page with height 1120px and there is an empty space above footer(and no save below of footer), but when I generate pdf file I see that footer is is not at bottom and there is a empty space below the footer.

Which is valid way to set the layout in the generated file?

Thanks!



via Chebli Mohamed

Aucun commentaire:

Enregistrer un commentaire