Search code examples
csshttphttpsgoogle-webfonts

Font looks different when site is server over https

Hi there I'm running into a problem

when website is viewed with https everything is made bold

https://www.healthinsurance.uk.net/

when its viewed with out the bold has gone?

I've never seen this before

Solution

  • Everything isn't made bold but you get your backup font (sans-serif) instead of the one you wanted.

    This happens because the font you are trying to load from Google Webfonts is hardcoded to regular http in your style.css.

    @import url(http://fonts.googleapis.com/css?family=News+Cycle:400,700);

    Change that line to the following and it should choose http or https based on the currently loaded page.

    @import url(//fonts.googleapis.com/css?family=News+Cycle:400,700);