Search code examples
htmlcssfontstypography

Typography.com font not loaded in FF

Im working on a site where I include a font from typography.com.

The nessecary file for the font is included as a css import:

@import 'https://cloud.typography.com/6741734/7240552/css/fonts.css'

And the font family is set as a variable like this:

$gotham = 'Gotham A', 'Gotham B' 

.body {
    font-family: $gotham;
}

The font is displayed and rendered correctly in the latest versions of Safari, Chrome and IE, however the font is not displayed in FF.

I am quite puzzled as to why this is happening, I have checked multiple versions of FF on different machines and the result is the same, the font is not loaded.

The page is goingplaces.jackjones.com

Solution

  • Try to use the @import without https:.

    Example: 

    @import "//cloud.typography.com/6741734/7240552/css/fonts.css";

    This should do it.

    Solution was seen on How Cloud.typography Works.