Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

WeasyPrint: fixed footer tag overlapped by long table on each pdf page

I generate with Django a table that I render in pdf thanks to WeasyPrint.

This table is potentially really long (rows number speaking) and so potentially ends in several pages pdf results. I must include a static footer at each end of page so I applied css fixed rule.

My problem is this footer is overlapped by the very long table. How can I ask to WeasyPrint (through css I think) to break the table before each footer and continue to render the table on the next page ?

<table>
    <tr></tr> <!-- a lot of rows, potentially spreading on several A4 pages -->
</table>

<footer style="position: fixed"> <!-- footer contents will be repeated and overlapped on each page until </table> is not reached -->

</footer>

I tried to use css rules as padding-bottom applied on table tag but with no success

thanks

like image 560
yoLotus Avatar asked May 18 '15 13:05

yoLotus


1 Answers

I found a solution for it.

First of all you've to define your page margins:

@page {
    size: A4;
    margin: 15mm 20mm;
}

I've a top & bottom margin of 15mm.

When you now place a fixed footer in the page/body, it will be "inside" these margins and non-fixed elements will overlap it. So what you want to do is moving the fixed footer "outside" of these margins:

footer
{
    position        : fixed;
    right           : 0;
    bottom          : 0;
    margin-bottom   : -10mm;
    height          : 10mm;
    text-align      : right;
    font-size       : 10px;
}

The fixed and bottom properties will place your footer on every page on the bottom, but within the defined margins (where it is overlapped). The height specifies the footer height, which is then moved "outside" the margins by the negative margin-bottom property. Just make sure that margin-bottom >= height.

Cheers Domi

like image 64
Dominique Barton Avatar answered Nov 01 '22 23:11

Dominique Barton