I was trying something fairly simple where I would create a table that covers 3 pages. It works fine if I don't add any @page margin, but once I add the margin it somehow creates an extra empty row in the table.

Margin added:

@page { @top-left { content: counter(page) ' of ' counter(pages); } margin: 0.5in 0.5in; }

Result:

File:

table-test.html

Note: This happens in Chrome and Edge, in Firefox it's not even rendering the pages properly anymore.

Any ideas?