Hello!

I been tying to solve this problem for the last 14 hours and I would really appreciate your help.

I have an HTML that generates a table that can contain up to 5 rows per page and 3 cells per row. For my requirements I need to scale down the table and all the elements inside of it.

But when I scale down the table, what happens is that instead of all the elements remaining on one page 2 rows remain on one page and there becomes a very large gap between these two rows and the rest of the page. Oddly enough the 3rd row starts on the second page. What I would like it to do is for all 3 rows to remain on the same page. I don't see why it wont do that since there obviously is enough space.

It's a bit hard to explain and so I have included two screenshots of the pdf file and the CSS file that I use. I coloured the table in green to make it easier to see it.

P.S. When I increase the page size from @page { size:8.5in 11.0in; } to @page { size:8.5in 20.0in; } everything does fit on the page, but I do need the page to be at 8.5in 11.0in.

Thanks!

1. princexml.css‎ 1.4 kB ‎
   simple CSS
2. princexml.jpg‎ 26.7 kB ‎
   Scale property applied
3. princexml_noscale.jpg‎ 31.9 kB ‎
   No Scaling

CSS transforms are applied after elements have been laid out, so they are a bit like relative positioning in that they don't affect how much space an element takes up. So in this case I expect Prince is packing the table as if it is full size, and then scaling it down later.

Thanks for your reply mikeday, is there anyway I can fix this? Maybe some trick or workaround?

You can apply shrink to fit for the entire page:

@page {
    prince-shrink-to-fit: auto
}

Or shrink the table manually, by reducing the font size and column widths. Or put it on a landscape page perhaps?

Thanks for your help, I will give those a try and will post my solution if I figure it out.

Did you guys get a chance to address this problem in Prince 10?

I never managed to solve this and what I have been doing since July 2014 is make the page size extremely large so that the table fits in the entire page and then once downloaded, I use Adobe Acrobat Pro to crop it to a regular 8.5" by 11" page size.

Perhaps Prince could scale down the table first and then pack it into the page recognizing its new smaller size. The more consistent Prince acts to how the CSS behaves on the browser, probably the better.

Prince-shrink-to-fit: auto unfortunately does not work since the table contains large images that I need to scale down to an exact dimensions.

Thanks!

Actually, did you ever try absolutely positioning the table, so that Prince will not try to break it across multiple pages, and then scale it down? That might work if you want the table to take a single page.

Wow, that worked beautifully. That's the solution. Thank you so much!

Excellent!

We actually have a table that expands both horizontally and vertically, and we want header and footer to remain unscaled, but scale the table so that first it fits horizontally then we split pages vertically.

We are doing all of this before sending the content to princeXML, in browser it looks fine but in prince transform:scale(0.75321562114) forces additional splits.

We cannot use position: absolute as this will place all pages on the first one.
Any other workarounds / suggestions are more than welcome!

In CSS we have:

.new_seating_report .new_seating_report_page {
transform: scale(0.552216);
transform-origin: left top;
will-change: transform;
}

The scale is calculated correct, all browsers render the content correct and the total amount of pages expected is: 3, but as you can see Prince generates 5 pages.

@page { prince-shrink-to-fit: auto } < has no effect.

For our implementation, this changed from issue to blocker.
Please advise!

1. prince_issue.pdf‎ 48.4 kB

Prince applies transforms after all other layout has been performed, so the page breaks will be based on the original full size table.

Hello Mikeday,

I understood that part from the previous comments, but is there any known work-around ?

Not really. I think the best solution would be to reduce the font size for the bits that you want to be small.

Working in pixels make that hard because the required scale factor is sometimes uneven.
I did however makage to make a scaling formula that works identical to prince scaling, so that in HTML we use transform-scale(...) while in prince we use prince-shrink-to-fit: auto.

On the long run though, it may prove useful to have a way to tell prince to evaluate page-breaks After a certain point of rendering.

Edited 21 Jul 2015 by softwarepse

You can use fractional pixel lengths in Prince, if that helps.