Disable table header repeating on page break when rendering as PDF

Question

PhantomJS seems to have issues with trying to make the table headers repeat on page breaks; the headers are sometimes in the wrong place, or they collide with existing content. I'm wondering if there is a way to disable table-header repeating on page-breaks, so that I can avoid this problem entirely?

Answer 1

Try this :

thead {display: table-row-group;}

Answer 2

This issue exists in phantomjs as of now. Refer https://github.com/ariya/phantomjs/issues/10927

you can adjust the margin of our document in rasterize.js to avoid it to some extent. I use 0.75cm as my margin to avoid it for a small margin. But even that is not working when i use landscape view. Also when you avoid style, cellspacing, cellpadding in your html, overlapping headers will not occur.

Answer 3

This is a tricky, But i solved it using simple logic. Cast table element to display as a Block element and it works.

display:block;
page-break-inside:avoid;