I created some simple HTML/CSS templates to use for creating PDF files for dynamically-driven reports. When I look at the templates as HTML files in my browser, the tables look fine, but after they’re converted to PDFs, all the ths and tds have double lines like in the screenshot. I can insert a css reset stylesheet into the template and it clears it up - but that messes up the other styles. What are the specific resets I need to fix this?
Can you post a link to a test page? Can you describe how you are creating the .pdf from an html file? We need more information to be useful to you.
PDF files are usually created using the print stylesheet rather than the screen stylesheet. If you want to create PDFs of web pages, it is a good idea to create a print stylesheet for this purpose. Without seeing your CSS it is difficult to be sure exactly where the problem is.
Have you tried just applying the reset to the td and not to all tags?
I ended up putting this:
table {
border-collapse: collapse;
border-spacing: 0;
}
as the very last thing in the print stylesheet. I had it at the beginning of the stylesheet but evidently there was something else in there that was cancelling it out. I’m not sure what it would be, though. There are no other border-collapse or border-spacing styles at all. Seems very odd.
Thanks for posting the resolution. Glad you were able to fix it.