2

It seems the font weight: 400 is bolder than 600. Does this happen only to me? On my Mac Book Pro, it displays the same on Chrome, Safari and Firefox. So, I guess it is not a browser related issue.

https://www.google.com/fonts#UsePlace:use/Collection:Source+Sans+Pro

What is the best solution for this? Using font weight:600 rather than 400 for a normal font weight? I don't know how to report the issue to Google.

shinyatk
  • 855
  • 11
  • 28
  • might help! [stack](http://stackoverflow.com/questions/5082632/same-font-yet-its-weight-seems-different-on-different-browsers) – yjs Dec 16 '15 at 05:03
  • Thank you yjs. For this issue, both webkit (Chrome/Safari) and moziila (Firefox) display the same issue. So, the cross browser font rendering is not the case. But I appreciate it. – shinyatk Dec 16 '15 at 05:08
  • 1
    It's likely this is an issue with your code, not the font itself. Have a look at this **[fiddle](https://jsfiddle.net/u1sjhufd/)**; on my machine, on all three browsers you mentioned the `font-weight` displays properly. – justinw Dec 16 '15 at 05:10
  • Thank you Quoid! You're right. For some reason, the browsers on my laptop display the font weight incorrectly even on your fiddle link. But I can see them properly when I looked at it on an online cross browser platform. I appreciate it. – shinyatk Dec 16 '15 at 05:23
  • @shinyatk glad to help, i've put an answer up so you can marked this as resolved – justinw Dec 16 '15 at 05:43
  • @Quiod I marked yours as resolved. I still need to figure out why on my machine shows incorrect font rendering. But you helped me to find out the problem was my machine not universal. Thanks! – shinyatk Dec 16 '15 at 05:46

3 Answers3

1

As mentioned in the comments, this is likely an issue with your machine (happens to the best of us).

Take a look at this fiddle on a different machine (I've personally verified font-weight changes on multiple browsers); you will see the differences.

justinw
  • 3,856
  • 5
  • 26
  • 41
1

Now I figured out why this happened. As @Quiod gave me a tip that the issue was on my machine not google's fault (of course). The reason was I "Synced fonts" with "Source Sans Pro Bold" on Adobe Typekit. When I unsynced it, the font displays properly. If the same things happen on the other fonts, you might need to uninstall your local fonts. Then the problem goes away. Thanks!

shinyatk
  • 855
  • 11
  • 28
0

Adobe has a font with the same "Source Sans Pro" name which confuses most browsers except for Internet Explorer. You can just delete it from the Control Panel/Fonts folder, no reboot necessary.

Dmitry S.
  • 8,373
  • 2
  • 39
  • 49