I’m trying to get a PDF Template to page break over different line items in a ‘product-table’. You can see the problem I am having below:
As you can see the line item draws over/under the page counter and on Page 2 the Line Item Header doesn’t add enough padding at the top and gets cropped.
I’ve tried adding ‘page-break-before’, ‘page-break-after’ and ‘page-break-inside’ to a variety of table elements via CSS, this includes to the entire table as well as the table row and it makes no difference.
I’ve also tried adding an empty div to the ‘Header’ and ‘Footer’ Sections of the Invoice Design but it seems that the header/footer in these HTML Sections is only added at the start and end of a document, not to each page. If it were to each page I could just throw a div in there and it would act as a spacer and draw the table rows around it.
Is it possible to do this or will I need to split it into 2x Invoices so that the Line Items fit on one page? Any help or advice would be appreciated.