New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

.container causing printing problem on OS X Safari #14868

Closed
gr2m opened this Issue Oct 24, 2014 · 10 comments

Comments

Projects
None yet
3 participants
@gr2m
Copy link

gr2m commented Oct 24, 2014

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 cvrebert added the css label Oct 24, 2014

@cvrebert cvrebert changed the title set widht for .container to auto for @media print .container causing printing problem on OS X Safari Oct 24, 2014

@cvrebert

This comment has been minimized.

Copy link
Member

cvrebert commented Oct 24, 2014

Might need to file a WebKit/Safari bug too.

@mdo

This comment has been minimized.

Copy link
Member

mdo commented Oct 28, 2014

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

@gr2m

This comment has been minimized.

Copy link
Author

gr2m commented Oct 28, 2014

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

This comment has been minimized.

Copy link
Member

mdo commented Oct 28, 2014

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

This comment has been minimized.

Copy link
Member

cvrebert commented Oct 29, 2014

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

@cvrebert

This comment has been minimized.

Copy link
Member

cvrebert commented Oct 29, 2014

Environment:

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

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

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

@cvrebert

This comment has been minimized.

Copy link
Member

cvrebert commented Oct 29, 2014

cvrebert added a commit that referenced this issue Oct 29, 2014

cvrebert added a commit that referenced this issue Oct 29, 2014

Merge pull request #14920 from twbs/safari-print-font-size
Add Wall of Browser Bugs entry for #14868
@mdo

This comment has been minimized.

Copy link
Member

mdo commented Oct 29, 2014

<3 you @cvrebert.

@cvrebert

This comment has been minimized.

Copy link
Member

cvrebert commented Oct 30, 2014

🐞s must 💀 !
😡 @ browser vendors.

@gr2m

This comment has been minimized.

Copy link
Author

gr2m commented Oct 30, 2014

Thanks @cvrebert, much appreciated!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment