Resizing to page width for print style sheet

So I've got a page that shows an image with some absolutely positioned text on top of it.

I want to write a print style sheet for it so that:

1. the image is resized to fit the width of the page
2. the text is repositioned and resized to maintain relative position and size with the image b开发者_StackOverflowehind it

So I know I can do (1) with just max-width: 100%, but I'm not sure how to accomplish (2). I'm okay with using some javascript if necessary, but I wanted to know if there's a way to do this in pure CSS. If I do need to use javascript, what can I hook to check for the pixel width of the image in the printed page? Just use the calculated width as normal?

And yes, this question might be more appropriate for DocType, but I've yet to get any help over there.

My problem was that I had set overflow: auto in the main div, which was causing the contents to overflow the printed page.

To fix it, all I needed to do was set overflow: none.

The overflow: auto was what was making it print like

I think you could happily leave it to the printer driver if you trim off the whitespace around the images, and then replace the margins on-screen with css, and the remove it again in a print-media stylesheet. Buiding-in the page margins is going to cause problems.