Letter Head header/footer not touching page edges in PDF (wkhtmltopdf, Repeat Header)

Frappe Framework Print Formats
, ,
1

Hi everyone,

I’m using a custom Jinja print format for Purchase Order with a full-width letterhead (a coloured strip + logo at the top, and a coloured strip + tagline at the bottom). The header and footer repeat on every page correctly, but in the PDF there is always a small white gap above the header (about 8mm) and below the footer (about 3mm). I need the strips to touch the top and bottom edges of the page.

Environment

  • Frappe: [version]
  • ERPNext: [version]
  • wkhtmltopdf: [version, from wkhtmltopdf --version]
  • PDF Generator: wkhtmltopdf (I also tried chrome in Print Settings and in the Print Format, with no change)
  • Print Settings: Repeat Header and Footer = ON, PDF Page Size = A4, Print Style = Redesign

Setup

  • The print format is based on the structure of the standard “Purchase Order Standard” format, with header in <div id="header-html" class="hidden-pdf"> and footer in <div id="footer-html" class="visible-pdf">.
  • Header image: 2482 × 440 px, footer image: 2482 × 178 px (both cut from an A4 300 dpi letterhead), shown at width: 100%.
  • Print Format margins: Top 38, Bottom 15, Left 0, Right 0. Custom CSS box is empty.
  • The standard “Purchase Order Standard” format with the same Letter Head shows the same gap.

What I have tried (none removed the gap)

  1. html, body { margin: 0 !important; padding: 0 !important; }
  2. margin: 0; padding: 0 on .letter-head, .letter-head-footer, .print-format-preview and the image itself.
  3. Changing Margin Top / Bottom in several steps. The gap stays the same size.
  4. A negative margin on .letter-head (margin-top: -8mm). This clips the top strip, but the white gap above it stays, so the gap seems to be outside the header’s area.
  5. Setting margin-top / margin-bottom on .print-format in CSS. Frappe reads these as PDF margins, and the content gets pushed down or overlapped by the header.
  6. Putting the letterhead inside the page body instead of the repeating header. The top edge then touches, but the header no longer repeats on every page.
  7. Using a table thead/tfoot for the letterhead. wkhtmltopdf did not break the table correctly (empty first page, overlapping content).

Question
Is it possible to make the repeating PDF header touch the top edge and the footer touch the bottom edge of the page with wkhtmltopdf in Frappe? For example:

  • Is there an option like header-spacing / footer-spacing that Frappe passes to wkhtmltopdf that I can override?
  • Does the pdf_header_html / pdf_footer_html template add spacing that can be removed?
  • Or is this a known wkhtmltopdf limitation, and is there a recommended workaround?

Screenshots of the PDF (top and bottom of the page) and the print format settings are attached.

Thanks in advance!

1 Like