React-pdf: Preventing other elements from crashing into a fixed footer

[idrisadetunmbi]

I have a document that has a fixed footer on all pages, but elements before the footer sometimes crash or overlap into it. This is because such elements can only wrap when it is calculated that they can't make the rest of the page without the height of the footer being taken into consideration.

<Document>
    <Page size={{ height: 472 }}>
        <View height={410}></View> // element won't wrap because it's height is not up to the page and crashes into the absolutely fixed footer below
        <View height={72} style={{ position: 'absolute', bottom: 0, left: 0, right: 0 }}></View> // fixed footer
    </Page>
</Document>

I could use the break prop for such elements but there is no way to dynamically determine when to apply it.

Is there a way to prevent this from happening?

[idrisadetunmbi]

For anyone with a similar situation, I had to give the Page a padding-bottom higher than the height of the footer.

[DeepakKapiswe]

Thanks a lot @idrisadetunmbi , I was also struglling with same issue.

[corneliushka]

Thank you too ! Worked like a charm (just the absolutely positioned and managing the padding bottom to the was enough).