Skip to main content
I
ignacioc1892
May 11, 2023
Question

Replic header in each page when convert HTML to PDF

  • May 11, 2023
  • 5 replies
  • 0 views
Hi!
I am trying to generate a pdf document from an html using the "HTML to PDF" plugin.

The html structure used is the following:
// HTML <table>
  <thead><tr><td>
    <div class="header-space">&nbsp;</div>
  </td></tr></thead>
  <tbody><tr><td>
    <div class="content">...</div>
  </td></tr></tbody>
  <tfoot><tr><td>
    <div class="footer-space">&nbsp;</div>
  </td></tr></tfoot>
</table><div class="header">...</div>
<div class="footer">...</div>// CSS.header, .header-space,
.footer, .footer-space {
  height: 100px;
}.header {
  position: fixed;
  top: 0;
}.footer {
  position: fixed;
  bottom: 0;
}

The problem comes when transforming to PDF. It works by replicating the header, but from the second page the content overlaps the header.




My cloud version is 22.3

5 replies

mallepup3914
mallepup3914
May 11, 2023

To avoid this issue, you can try setting the position of the header to "absolute" instead of "fixed". This will keep the header in the normal document flow.

.header {
  position: absolute;
  top: 0;
}
.footer {
  position: fixed;
  bottom: 0;
}

I
ignacioc1892Author
May 12, 2023

With absolute position, not replicated each page only first

stefanhelzle0001
stefanhelzle0001
May 11, 2023

You can do that using specific CSS. Check the documentation of the used library: github.com/.../openhtmltopdf

J
jenniferg248
June 28, 2024

Hey Stefan, there is a lot going on in the library you linked and I don't have much experience with github. Can you point to the file that refers to this topic?

allenp0001
allenp0001
Known Participant
June 27, 2024

Did you resolve this and if so, how?

Terms & ConditionsAccessibility statement