I've got a completed (well, not completed, but it's in production) site that's had a print stylesheet set up for certain pages. That's worked so far in IE7 & 8, Firefox, Chrome 4 and 5, and Safari 4. However, the working stylesheet absolutely doesn't work with Safari 5 from either Windows or OS X. The problem is not subtle: text is printed in a ridiculously small font size, all jammed together into a single very narrow column towards the right side of the page. That layout is (as you might guess) absolutely nothing like what is intended (and what works for Safari 4); basically the print layout just puts things down on the pages in a mostly straightforward boring way (since print CSS is so lame in general).

I've tried some random (literally, random) changes to see if I can find some particular part of the stylesheet that's at fault, but nothing seems to make a difference. What I'm wondering is whether something in particular has changed with Safari 5 about how it handles printing.

2 answers

1
point
This was chosen as the best answer

The solution is to comment out the @page rules.

The reason is that Safari 5 is treating them as if they were "*" rules. That is, the margin is being applied to everything on the page, and every block-level element. Way to go Safari 5!

Note that other browsers currently ignore these @page rules so you lose little by commenting them out.

Finally, I learned all this at http://whatsthepointy.blogspot.com/2010/06/safari-5-has-some-printing-problems.html

Eric Klien
Lifeboat Foundation
+1 (775) 329-0180 Voice
+1 (775) 329-0190 Fax
Skype ID lifeboathq
Twitter lifeboathq
http://lifeboat.com

Answered almost 6 years ago by Eric Klien
  • Thanks - I'll vote you up because that's actually my own blog :-) Mike McNally almost 6 years ago
0
points

Well so far I've found the @print rules in stylesheets — which traditionally have been a pointless, though harmless, waste of time anyway — really do bad things to Safari 5. I'm not exactly sure what it is, but here's a sample page: http://gutfullofbeer.net/print.html

If you visit that site in Safari 5 and try to print the page, you'll get something that's obviously wrong. The page text will be jammed over in a narrow box towards the right side of the page. (The print stylesheet puts the bordered box around the text, so that part's OK, but the box should be bigger.) If you save the page and comment out the @page rules, it prints fine.

Answered over 6 years ago by Mike McNally