web-dev-qa-db-fra.com

wkhtmltopdf répétition des en-têtes de tête chevauchant le contenu

Nous intégrons wkhtmltopdf (0.12.1) dans une application Java, en utilisant stdin et stdout pour les entrées/sorties. Nous voulons plusieurs en-têtes (différents) dans notre PDF, donc au lieu d'utiliser le --header-html option nous utilisons un thead, qui est répété sur plusieurs pages. Voici un petit exemple HTML:

<!DOCTYPE html>
<html>
<body> 
    <table style="page-break-after: always;">
        <thead>
            <tr>
                <th>My first header</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>First content</td>
            </tr>
        </tbody>
    </table>
    <table>
        <thead>
            <tr>
                <th>My second header</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>Second content</td>
            </tr>
        </tbody>
    </table>
</body>
</html>

Jusqu'ici tout va bien. Des problèmes surviennent lorsque le contenu s'étend sur plusieurs pages. L'en-tête s'affiche ensuite au-dessus du contenu, en le chevauchant. Exemple html et PDF . Notez que le deuxième en-tête est rendu très bien, car le tr ne couvre qu'une page.

D'autres personnes ont eu des problèmes similaires. Il existe quelques solutions pour cela lorsque vous utilisez le --header-html option, comme l'ajout de --header-spacing ou --margin-top, mais ces options n'ont aucun effet sur le thead répété. Des idées?

wkhtmltopdf
25
Jeroen I.

Je l'ai résolu avec ces trois règles CSS:

thead { display: table-header-group; }
tfoot { display: table-row-group; }
tr { page-break-inside: avoid; }
41
Juan Carlos Velez

vous résolvez ce problème en ajoutant le CSS suivant.

   tr {
         page-break-inside: avoid;
      }
9
Tunde Pizzle

J'ai trouvé tr { page-break-inside: avoid; } a fonctionné jusqu'à un certain point, mais pas lorsque mes en-têtes s'étalaient sur plusieurs lignes. Comme je voulais garder ma section thead, ma solution était de désactiver la répétition.

thead, tfoot {
  display: table-row-group;
}
3
Hugh