No border at bottom while page break

I added page-break-inside: avoid; to [data-ref="table"] > tbody > tr > td

    [data-ref="table"] > tbody > tr > td {
        border-bottom: 1px solid #e6e6e6;
        padding: 0.75rem;
        border: 1px solid black;
        border-collapse: collapse;
        page-break-inside: avoid;
    }

This makes the overflowing rows get moved to next page so there isn’t a row that gets split between two pages.

Here is example of the multi page invoice before this change (the last row on first page is getting extended):

and there is the invoice after this modification is added (the large row gets moved to next page):

2 Likes