css – Changing for landscape orientation after page break from html to pdf using velocity

0
170
html - Animation after toggling doesn't apply the second style


In order to extract data into one pdf document, I am using openhtmltopdf, velocity and a css stylesheet.
It works fine so far but at some point I want to change my page orientation to landscape as i want to display one table with several columns.
I tried to create one <div class="landscape"> with the following attributes transform: rotate(270deg);translate(-296mm, 0); but it doesn’t work. The table is overcoming several pages ignoring the page format.
Can you help pointing my error ?
Thanks in advance.

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8"/>
        <style>#include("style.css") </style>
        <style>
            @page {
                size: A4;
            }
            @page {
                margin-left: 10mm;
                margin-right: 10mm;
                margin-top: 10mm;
                margin-bottom: 10mm;
            }
        </style>
    </head>
    <body class="fontmmMedium">
        <div style="padding-top: 5mm"></div> 

            [...]
            
            ## Tableau des Données **
            <div class="landscape" style="page-break-before:always;transform: rotate(270deg);translate(-296mm, 0);transform-origin: 0 0;">
                <table class="borderGrooveGrey print-page_new" style="width: 100%; padding: 5px; margin-top: 5mm;">
                    <thead>
                        <tr>
                            <th class="borderGrooveGrey" colspan="3" >Données</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr></tr>
                        #foreach ($donnee in $traitementBean.donnees)
                        <tr>
                            <td>
                                $donnne.typeDeDonnees.libelle
                            </td>
                            <td>
                                $donnne.nom 
                            </td>
                            <td>
                                $donnne.description 
                            </td>
                        </tr>
                        #end
                    </body>
                </table>
            </div>
        </div>
        #end
        #end        
    </body>
</html>



Source link

Leave a reply

Please enter your comment!
Please enter your name here