Welcome Guest Search | Active Topics | Sign In | Register

Essential Objects Product Support Forum » All Products » Support » Text overlaps to next row and/or cut off at edge of document

Text overlaps to next row and/or cut off at edge of document Options
Previous Topic · Next Topic
tnguyen
Posted: Tuesday, March 17, 2020 3:14:14 PM
Rank: Newbie
Groups: Member

Joined: 3/17/2020
Posts: 4
Hi,

My report generates just fine with HTML opened on Google Chrome but when I converted it to PDF and view the report in Landscape, the text is overlapping to the next row. If the text is on right side of the paper, the text will get cut off it is too long. It is not word-wrap like it should.

Please help. Thanks!


Here is my HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<style>

div {
position: absolute;
color: #000000;
vertical-align:bottom;
font: 7pt 'Arial';
}

div.wrap {
white-space: normal;
}


div.alignLeft {
text-align: left;
}

div.alignRight {
text-align: right;
}

div.vAlignMiddle {
vertical-align: middle;
}

div.outerDiv {
display: table;
}

div.innerDiv {
position: relative;
display: table-cell;
font: inherit;
}

</style>

</head>
<div>
<div class=" outerDiv alignLeft" style="top:0.5in; left:0in; width:10.5in; height:0.1917in; font:bold 12pt 'Arial'; " >
<div class="vAlignMiddle innerDiv" style="position: relative; display: table-cell; font: inherit; " >My Report
</div>

</div>
<div class=" outerDiv alignLeft" style="top:0.89in; left:0in; width:3.5in; height:0.1118in; font:bold 7pt 'Arial'; border-bottom-style: solid; border-bottom-color: #000000; border-bottom-width: 1px; " >
<div class="vAlignMiddle innerDiv" style="position: relative; display: table-cell; font: inherit; " >Name
</div>

</div>
<div class=" outerDiv alignLeft" style="top:0.89in; left:3.52in; width:1.5in; height:0.1118in; font:bold 7pt 'Arial'; border-bottom-style: solid; border-bottom-color: #000000; border-bottom-width: 1px; " >
<div class="vAlignMiddle innerDiv" style="position: relative; display: table-cell; font: inherit; " >Address 1
</div>

</div>
<div class=" outerDiv alignLeft" style="top:0.89in; left:5.04in; width:1.5in; height:0.1118in; font:bold 7pt 'Arial'; border-bottom-style: solid; border-bottom-color: #000000; border-bottom-width: 1px; " >
<div class="vAlignMiddle innerDiv" style="position: relative; display: table-cell; font: inherit; " >Address 2
</div>

</div>
<div class=" outerDiv alignLeft" style="top:0.89in; left:6.56in; width:1in; height:0.1118in; font:bold 7pt 'Arial'; border-bottom-style: solid; border-bottom-color: #000000; border-bottom-width: 1px; " >
<div class="vAlignMiddle innerDiv" style="position: relative; display: table-cell; font: inherit; " >City
</div>

</div>
<div class=" outerDiv alignLeft" style="top:0.89in; left:7.58in; width:0.5in; height:0.1118in; font:bold 7pt 'Arial'; border-bottom-style: solid; border-bottom-color: #000000; border-bottom-width: 1px; " >
<div class="vAlignMiddle innerDiv" style="position: relative; display: table-cell; font: inherit; " >State
</div>

</div>
<div class=" outerDiv alignLeft" style="top:0.89in; left:8.1in; width:2.5in; height:0.1118in; font:bold 7pt 'Arial'; border-bottom-style: solid; border-bottom-color: #000000; border-bottom-width: 1px; " >
<div class="vAlignMiddle innerDiv" style="position: relative; display: table-cell; font: inherit; " >Category
</div>

</div>
<div class=" outerDiv wrap alignLeft" style="top:5.2918in; left:0in; width:3.5in; height:0.11in; " >
<div class="vAlignMiddle innerDiv" style="position: relative; display: table-cell; font: inherit; " >Company One
</div>

</div>
<div class=" outerDiv wrap alignLeft" style="top:5.2918in; left:3.52in; width:1.5in; height:0in; " >
<div class="vAlignMiddle innerDiv" style="position: relative; display: table-cell; font: inherit; " >&nbsp;
</div>

</div>
<div class=" outerDiv wrap alignLeft" style="top:5.2918in; left:5.04in; width:1.5in; height:0in; " >
<div class="vAlignMiddle innerDiv" style="position: relative; display: table-cell; font: inherit; " >&nbsp;
</div>

</div>
<div class=" outerDiv wrap alignLeft" style="top:5.2918in; left:6.56in; width:1in; height:0in; " >
<div class="vAlignMiddle innerDiv" style="position: relative; display: table-cell; font: inherit; " >&nbsp;
</div>

</div>
<div class=" outerDiv wrap alignLeft" style="top:5.2918in; left:7.58in; width:0.5in; height:0in; " >
<div class="vAlignMiddle innerDiv" style="position: relative; display: table-cell; font: inherit; " >&nbsp;
</div>

</div>
<div class=" outerDiv wrap alignLeft" style="top:5.2918in; left:8.1in; width:2.5in; height:0.56in; " >
<div class="vAlignMiddle innerDiv" style="position: relative; display: table-cell; font: inherit; " >Zero, One, Two, Three, Four, Five, Six, Seven, Eight, Nine, Ten, Eleven, Twelve, Thirteen, Fourteen, Fifteen, Sixteen, Seventeen, Eighteen, Nighteen, Twenty, Twenty-one, Twenty-two, Twenty-three, Twenty-three
</div>

</body>

</html>
Back to top
 
eo_support
Posted: Tuesday, March 17, 2020 3:58:59 PM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,071
Hi,

This is because the default margin for EO.Pdf is 1 inch on each size and the default print margin in Google Chrome is 0.5 inch. Generally it is not a good idea for you to design your report to rely on specific margin settings. However if you just want this particular report to work, you can change EO.Pdf margins to 0.5 inch. For example:

Code: C# 
HtmlToPdf.Options.PageSize = new SizeF(PdfPageSizes.Letter.Height, PdfPageSizes.Letter.Width);
HtmlToPdf.Options.OutputArea = new RectangleF(0.5f, 0.5f, 10f, 7.5f);
HtmlToPdf.ConvertUrl(report.html, pdf_file);


This should give you the desired result.

Thanks!
Back to top
 
tnguyen
Posted: Wednesday, March 18, 2020 7:52:29 AM
Rank: Newbie
Groups: Member

Joined: 3/17/2020
Posts: 4
eo_support wrote:
Hi,

This is because the default margin for EO.Pdf is 1 inch on each size and the default print margin in Google Chrome is 0.5 inch. Generally it is not a good idea for you to design your report to rely on specific margin settings. However if you just want this particular report to work, you can change EO.Pdf margins to 0.5 inch. For example:

Code: C# 
HtmlToPdf.Options.PageSize = new SizeF(PdfPageSizes.Letter.Height, PdfPageSizes.Letter.Width);
HtmlToPdf.Options.OutputArea = new RectangleF(0.5f, 0.5f, 10f, 7.5f);
HtmlToPdf.ConvertUrl(report.html, pdf_file);


This should give you the desired result.

Thanks!


I adjusted the page margin per your recommendation but the text is still cut off at the edge.

EDIT: I noticed that our report's margin is set to 0.25 on each side.
Back to top
 
eo_support
Posted: Wednesday, March 18, 2020 4:00:18 PM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,071
What version do you use? We tested on the latest build and it seems to work fine for us.
Back to top
 
tnguyen
Posted: Thursday, March 19, 2020 7:46:17 AM
Rank: Newbie
Groups: Member

Joined: 3/17/2020
Posts: 4
eo_support wrote:
What version do you use? We tested on the latest build and it seems to work fine for us.


We have version 15.3.1.0.
Back to top
 
eo_support
Posted: Thursday, March 19, 2020 2:15:39 PM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,071
Hi,

You should switch to the latest version. Version 15 uses an old WebKit based browser engine that can render things very differently than Google Chrome. We switched to Google's Chromium engine since version 16. Even with Chromium engine, different version can still render different result. This is why we have been constantly updating the version of Chromium engine we use every year.

Another reason that we keep upgrading browser engine is for security. Browser engine updates very fast these days and new security issues are constantly being discovered and patched. So running an 5 years old EO.Pdf is like running a Web browser or Windows without applying any security patches for 5 years. This obviously is not a good idea.

Thanks!
Back to top
 
tnguyen
Posted: Friday, March 20, 2020 8:11:26 AM
Rank: Newbie
Groups: Member

Joined: 3/17/2020
Posts: 4
Thanks for your guidance.
Back to top
 
eo_support
Posted: Friday, March 20, 2020 1:33:50 PM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,071
You are very welcome. Please feel free to let us know if you have any more questions.
Back to top
 


You cannot post new topics in this forum.
You cannot reply to topics in this forum.
You cannot delete your posts in this forum.
You cannot edit your posts in this forum.
You cannot create polls in this forum.
You cannot vote in polls in this forum.