Table not rendered correctly when using -fs-table-paginate: paginate #142
Description
When applying -fs-table-paginate: paginate;, I encountered several issues with table rendering.
1. The cell borders are rendered outside the table border.
In the example image above, the table border is rendered with a 14 mm margin, while the cell borders are rendered at a 12 mm margin.
Conditions to Reproduce
- The table element has
-fs-table-paginate: paginate;applied. - Borders are defined on both the table and the table cells.
When using -fs-table-paginate: paginate;, the borders of child cells are rendered outside the table’s border.
In the provided HTML, the @page rule defines a 12 mm page margin.
HTML & PDF
2. Cell borders overlap the thead area
In the example image, the <thead> cells have a red border, but the borders of the <tbody> cells are rendered over them, making the red border appear gray instead.
This is the output when the <thead> is defined outside and wraps the entire <table> element.
Conditions to Reproduce
- The table element has
-fs-table-paginate: paginate;applied. - When the cells in the <thead> and the <tbody> have different border styles
When the tbody content is split across pages, the next page begins with the thead as expected, but the tbody cell’s border is rendered over the thead.
HTML & PDF
3. Incorrect background color area in table cells
The background fill area is rendered incorrectly.
Conditions to Reproduce
- The table element has
-fs-table-paginate: paginate;applied. - When a cell with
rowspanspans across multiple pages
The cell background color does not fully cover the entire cell area on the first page.
This appears to be related to where the text inside the cell ends.
The background color sometimes overflows into cells within the same row.
If a rowspan cell continues onto the next page and there is no text inside it on that page, the background color can extend beyond its cell area and even cover the thead region.