weasyprint : how to push layer to bottom of page but preventing content overlapping (invoice sample)

Question

I am using the library weasyprint in Python to convert a html/css to a pdf. I am using the invoice project sample, where the totals table is absolutelly positioned and pushed to bottom with bottom: 0.

If there are more rows, the totals table is overlapping and hiding the table rows.

Is there any way to keep the totals stuck to the bottom of page but preventing the table overlapping?

I attach files with the result for 4 rows (ok), 11 rows (wrong) and 12 rows (ok).

I think is a very common use case the generation of tabular documents ending with some sort of summary.

4 rows (ok)

11 rows (wrong)

12 rows (ok)

Answer 1

1. In case the height of the 'totals' block is fixed

You can add an empty div at the end of the document that will be used as a placeholder for the 'totals' block. If the height is 5cm, you can go with:

<div style="height: 5cm"></div>

This will than be covered by the absolute positioned 'totals' block.

2. In case the height might change based on its contents

According to this Github comment one solution might be adding the footer twice: one invisible as a placeholder and one visible on the top of the invisible. This way the contents of the 'totals' block will be replicated exactly to match its height:

https://github.com/Kozea/WeasyPrint/issues/1243#issuecomment-759661116