|
Rank: Member Groups: Member
Joined: 8/27/2012 Posts: 11
|
Does absolute positioning using inline styles work correctly when converting html to PDF, or is this not fully supported?
|
|
Rank: Administration Groups: Administration
Joined: 5/27/2007 Posts: 24,195
|
Hi,
It is fully supported.
Thanks!
|
|
Rank: Member Groups: Member
Joined: 8/27/2012 Posts: 11
|
Can you tell me why this HTML doesn't seem to work? I am trying to generate 2 pages using page-break-before:always on the second one. They use the same position, but shouldn't the position being used be relative to the page? The second parent div seems to be overlapping the first. Thanks!
<div style="position:relative;"> <div style="position:absolute;left:170;top:20;">Form 1</div> <div style="width:100%;background:#000000;color:#ffffff;padding:2px 4px 2px 4px;position:absolute;left:0;top:60;">Section A. Administrative</div> <div style="position:absolute;left:30;top:120;">1)Date of visit:</div> <div style="position:absolute;left:150;top:120;color:#003399;font-style:italic;">05/19/1984</div> </div>
<div style="position:relative;page-break-before:always;"> <div style="position:absolute;left:170;top:20;">Form 2</div> <div style="width:100%;background:#000000;color:#ffffff;padding:2px 4px 2px 4px;position:absolute;left:0;top:60;">Section A. Administrative</div> <div style="position:absolute;left:30;top:120;">1)Date of visit:</div> <div style="position:absolute;left:150;top:120;color:#003399;font-style:italic;">12/16/1991</div> </div>
|
|
Rank: Administration Groups: Administration
Joined: 5/27/2007 Posts: 24,195
|
That's how it supposes to work. Elements are positioned based on your document, not based on PDF pages. The HTML to PDF converter produces result exactly as they are rendered on screen by your browser. So if you have a document that runs 3 pages, the 0 Y position will be the top of the first page. Think your HTML output as a long paper, the paging process decides where to "cut" between pages. It does not reposition contents. All contents have already been positioned before paging occurs.
Try to view the HTML in your browser and you will see them overlap too ---- this is the rule --- if they overlap in your browser, then they will overlap in PDF. We cannot reinvent or change HTML layout rules.
Thanks!
|
|
Rank: Member Groups: Member
Joined: 8/27/2012 Posts: 11
|
Thank you. I figured out what is going wrong. It is working how I wanted to, the absolute positioned divs are relative to the parent div, which starts a new page. But I didn't assign the parent div a height, and since absolute position elements are floating, the parent div won't grow to accomodate them. I assigned a height to the parent div and it works correctly now.
|
|
Rank: Administration Groups: Administration
Joined: 5/27/2007 Posts: 24,195
|
Ah. I see. Thank you very much for the update!
|
|