|
Rank: Newbie Groups: Member
Joined: 8/17/2012 Posts: 3
|
My company is evaluating HtmlToPdf and we ran into this issue.
If I convert the following html the 'Report Header' div renders with a line on the TOP when the line should be on the bottom. If you view the html as HTML is shows this. Any help would be appreciated.
--begin HTML
<html> <head> <style> DIV {position: absolute; color: #000000;} SPAN {cursor: hand;} A:link {color: blue;} A:visited {color: blue;} A.line {position: absolute; color: black; text-decoration: none; font-size: 0pt;} A.line:visited {color: black;} </style> </head> <body bgcolor="#FFFFFF"> <div style="text-align:Left;background:transparent;top:0.5in; left:0.25in; width:8in; height:0in; font:bold 12pt 'Arial'; border-bottom-style: solid; border-bottom-color: #000000; border-bottom-width: 1; ">Report Header</div> <div style="text-align:Right;background:transparent;top:0.56in; left:0.25in; width:8in; height:0in; font:7pt 'Arial'; ">Printed: 03:16 PM 08/17/2012</div> <div style="text-align:Left;background:transparent;top:0.75in; left:0.25in; width:0.63in; height:0.15in; font:1pt 'Arial'; background-color:#E4E4CB; z-index:-1; "></div>
</body> </html>
-- end html
This is the .net (3.5) code I use. The margins are 1/2" and the page width/height is 8.5/11
--begin C#
HtmlToPdf.Options.PageSize = PdfPageSizes.Letter; EO.Pdf.HtmlToPdf.Options.OutputArea = new RectangleF((float)Page.TopMargin, (float)Page.LeftMargin, (float)Page.Width, (float)Page.Height);
HtmlToPdf.ConvertHtml(page, "C:\\Temp\\EO_HTML2pdf.pdf");
--end C#
|
|
Rank: Administration Groups: Administration
Joined: 5/27/2007 Posts: 24,195
|
Hi,
This is normal. You can try to view your HTML with Google Chrome browser and you will see Chrome generates the same output as us.
The root of the problem is you have "height:0in" on your DIV. In that case Chrome (and us) honor this setting and give DIV zero height. IE does not honor it and instead automatically enlarge the DIV to the text height. This sounds reasonable but it does not comply with HTML standard. In fact if you add the following text at the top of your HTML file:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
That will switch IE into standard compliant mode and you will the line appears at the top of the text. Our rendering engine is most close to Google Chrome. So you can use Chrome to verify/debug your HTML for such issues.
Thanks!
|
|
Rank: Newbie Groups: Member
Joined: 8/17/2012 Posts: 3
|
Wow, that is fantastic support! I truly appreciate your thorough answer and explanation.
|
|
Rank: Administration Groups: Administration
Joined: 5/27/2007 Posts: 24,195
|
Hi,
You are very welcome. Please feel free to let us know if there is anything else.
Thanks!
|
|