[Html2PdfConverter] Overlapping column header and content of table records

Forge Component
(60)
Published on 17 May by Guilherme Pereira
60 votes
Published on 17 May by Guilherme Pereira

Hi All,


if on subsequent pages, like page 2, 3 etc. the heading of a grid is duplicated to the next page, and overlaps the table contents.


This is happened only if the page is splitted exactly right after the column header. (please see pic below). 

Anyone had this issue? Is there anyway I could prevent this?



Thanks,

Daniel

Solution

Hi Dan,


Have you tried the workaround suggested on the FAQ 


Q) How can I control the header on my pages?

A) By using css.

  • If you want to prevent your table header to be repeated on other pages, you should apply the following CSS styles on the page that you are printing:

  • If you want to maintain your table header repeated on all pages but still ensure that the content don't overlap you can try the below solution:


Cheers,

Guilherme

Solution

Excellent, it's working perfect.

Sorry, I missed that in FAQ, I should have checked it better.


Thanks a lot Guilherme

Guilherme Pereira wrote:

Hi Dan,


Have you tried the workaround suggested on the FAQ 


Q) How can I control the header on my pages?

A) By using css.

  • If you want to prevent your table header to be repeated on other pages, you should apply the following CSS styles on the page that you are printing:

  • If you want to maintain your table header repeated on all pages but still ensure that the content don't overlap you can try the below solution:


Cheers,

Guilherme

This isn't working for me. Is there anything else that can be done?


Paree Bansal wrote:

Guilherme Pereira wrote:

Hi Dan,


Have you tried the workaround suggested on the FAQ 


Q) How can I control the header on my pages?

A) By using css.

  • If you want to prevent your table header to be repeated on other pages, you should apply the following CSS styles on the page that you are printing:

  • If you want to maintain your table header repeated on all pages but still ensure that the content don't overlap you can try the below solution:


Cheers,

Guilherme

This isn't working for me. Is there anything else that can be done?

Hi, overlapping is a problem of wkhtmltopdf tool which is not completly solved yet, you can find all possible combinations of css and recommendations in the original thread : https://github.com/wkhtmltopdf/wkhtmltopdf/issues/1524


Hi, until yesterday I thought I've mastered HTML2PDF component but unfortunately I'm stuck with an issue which I'm unable to resolve. I know the issue is with wkhtml binary but I was trying my luck if someone can sort this one out for me.

I wanted repeated Table header in all the pages of my PDF, but on trying to do so I get overlapping of content over my header.

I have tried almost all the permutation combination of CSS but the issue seems to exist. 

If you need a link to this HTML please click here, this page contains all the necessary CSS

I have also tried passing wkhtmltopdf header and footer parameters which works fine but unfortunately generation of header file is slow(need to increase my delay) and cumbersome and not interested to go by this approach.