.container causing printing problem on OS X Safari

[gr2m]

I've run into an issue with the latest Safari on Mac OS X (10.9 & 10.10), where the printed page had a much smaller font size than on all other browsers. It looked like the entire page was zoomed out.

What's causing this is .container. Once I set it to width: auto for @media print, the problem. You can see the effect a bit on this page: http://jsbin.com/kamafuluxe/3. The difference between the print on Safari and other browsers is much bigger in our internal app though.

Happy to send a pull request

[cvrebert]

Might need to file a WebKit/Safari bug too.

[mdo]

Yeah, sounds like a browser inconsistency and not something we'd be able to control.

[gr2m]

I agree, I'll try to make a reduced test case and keep you posted. Might be worth to list it as known issue.

But either way, is there anything that speaks against setting

@media print {
  .container {
    width: auto;
  }
}

Although the other browser seem to handle it fine that .container has a fixed width, I thing it would be more reliable to set it to auto so that it expands to the available place, to prevent browsers to potentially cut off content or to scale it down.

[mdo]

That'd require some testing and I'm unsure if it's screw with folks' current expected behavior. If you're willing to thoroughly test it out, I'd be down to see a pull request.

[cvrebert]

Confirmed with Safari Version 8.0 (10600.1.25) on OS X Yosemite.

[cvrebert]

Environment:

• Webpage: http://jsbin.com/tuxos/2
• Paper size: US Letter
• OS X Yosemite
• Firefox 3.0.2
• Chrome 38.0.2125.111
• Safari 8.0

Comparison of font sizes when printing (click for full resolution):

Once again (#12078), printing in browsers is screwy. 😡

And yes, @gr2m's workaround does make Safari scale things closer to the other browsers.

[cvrebert]

Filed WebKit bug: https://bugs.webkit.org/show_bug.cgi?id=138192

[mdo]

<3 you @cvrebert.

[cvrebert]

🐞s must 💀 !
😡 @ browser vendors.

[gr2m]

Thanks @cvrebert, much appreciated!