0

i have an jpg where the height is larger than a regular 8.5x11 piece of paper (the height is around 2000px)

here is the link http://i39.tinypic.com/121d7ur.jpg

so obviously when you try to print this picture its going to print on more than 1 piece of paper ....however when i try to print the page (or even go to print preview)...it only shows half the image on the first page....but there is no second page?...there should be a second page to show the rest (or even a 3rd page)

if i use FF there is no problem...it prints on 3 pages....but with IE 7 i'm limited to just printing 1 piece of paper.

i have right right clicking on the image itself within IE7 and clicking "print this image" and still no luck.

anyone have a solution for this?

1
  • its broken in IE8 too (for the record)
    – scunliffe
    Jan 13, 2009 at 21:20

3 Answers 3

4
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Blank XHTML 1 Transitional Page</title>
<style>
@media print {
    html { height: 100%; }
    img { height: 100%; }
}
</style>
</head>
<body>
    <img src="bigimage.jpg" />
</body>
</html>

EDIT: Sorry, didn't initially realize your image was too TALL rather than too WIDE. To reduce the image height whilst maintaining aspect ratio, use CSS to set both HTML and IMG to have a height of 100% - see modified example.

1
  • unfortunately i still get the same problem. your solution made my picture fill the whole page of paper but still cut off halfway......naturally the image should be printed on multiple pieces of paper due to it's large size.
    – dezwald
    Jan 13, 2009 at 21:20
2

I know this probably isn't the answer you are really looking for, but if you are intending on the users printing the image, I would consider putting it into a PDF. That way it will always print the same, everytime for everyone.

1

Try wrapping the image in a div, in the div css apply the following:

image_wrapper {*height:1%; position:relative}

The star/* selector should limit to IE, this is a variant of the holly hack.

2
  • this "hack" also fixes the issue where the image is printed twice in IE7
    – MJJames
    Jul 18, 2011 at 8:30
  • This worked for me, as well. Thank you. I needed the variant of the holly hack to fix an ie7/ie8 comp issue, as an image was cutting off when printing. Is there a similar hack for printing issues with Opera?
    – user717236
    Jan 24, 2012 at 19:13

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.