I am generating content that has a lot of images. The images are usually associated with an <h2> tag some <p> tags. I have grouped the <h2>, <p> and <img> together in a <div> and am using page-break-inside: avoid; to keep them together. This works well is most cases.

Sometimes when an image is really tall I will see a page break after the paragraph text. What I end up with is a <h2> and a <p> near the top of the page, a lot of white space and then the image on the next page. I'm wondering if there is a way to have Prince try to make the image fit on the same page as the <h2> and <p> content by scaling it up to some specified percentage?

Trevor DeVore
ScreenSteps
http://www.screensteps.com

No, I don't think this is possible at the moment, as CSS has no way to scale the height like that as far as I'm aware.

Okay.

One thought I had was that you could dynamically set the height/width if you could specify a javascript callback that occurred at the moment where Prince was deciding if it should add a page break. If Javascript could be used to determine the available height and then the image was resized accordingly then perhaps Prince could reevaluate whether to put it on the page.

I'm not sure how practical that is though.

Trevor DeVore
ScreenSteps
http://www.screensteps.com

In the future this may be possible, when the JavaScript can change the document during conversion.

Hi Mike,

This is a feature that I could use too. At the moment when an image doesn't quite fit onto the page it leaves behind a lot of white space. This is unacceptable for my client, who goes on to perform a whole lot of manual changes to the document in order to change the fit of the content.

Would the box tracking API help with this? I'm not clear if you can use it to change the fit of the content.

Thanks,
Matt