Skip to content
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

Mismatch between set $default-font-size and what the browsers are expecting #2

Open
taupecat opened this issue Aug 19, 2013 · 0 comments
Labels

Comments

@taupecat
Copy link
Owner

Josh,

I tried the revised breakpoint code that you provided for the first time this weekend, and got some unexpected results. My default font size for this project is 13px, and thus the font-size on my HTML element is 81.25%. I wanted my first breakpoint to be at 600px, so the Sass as written computed the breakpoint to be 46.15385ems.

However, the browsers (Chrome and Firefox) interpreted 46.15385em value to be 738.46154px because they were using 16px as their default font size, not the 13px I expected. It turns out that I should have done "600px / 16px + em", which gives me a breakpoint of 37.5em, which worked perfectly.

It seems to boil down to this: http://blog.cloudfour.com/the-ems-have-it-proportional-media-queries-ftw/#baseline-expectations

So I'm going to submit a pull request on my own project (can you do that?), and approve it if you concur with my findings.

Thanks.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

1 participant