Google fonts not showing

Google fonts not showing
0.0 0

#1

I’m trying to get google fonts to display but it’s not working.

In the header I have:

Then in my style sheet I have

.intro-text {
margin-top: 60px;
font-family: ‘Baloo Chettan’, serif;
font-align: center;
}

But it will only display as serif. Any ideas?


#2

Use a browser other than IE,

You can try http in the font link, instead of https. That can work sometimes if IE. This can cause console errors in some browsers.

If that doesn’t get them working, try declaring them in CSS with @import with http or HTTPS

If that doesn’t work you can look up the bullet proof @font-face syntax!

Also make sure the link is pasted correctly from Google, it looks to have one too many quotes in it but I’m.on my phone so can’t check that.

HTH

Mark


#3

I’m using Chrome - doesn’t work in Chrome or IE.

What is odd is that it works with the Lobster and Tangerine font. Just not the Baloo Chettan font.


#4

Could it be the URL then or the rule.

I would.just re paste the links from Google again for the hell.of it.

Maybe there’s supposed to be a dash between the words in the CSS, or they should be capitalised.

All.these things I’ve mentioned are issues I’ve had with Google fonts btw!


#6

The link from google fonts has a + instead of a - like you have
<link href="https://fonts.googleapis.com/css?family=Baloo+Chettan" rel="stylesheet">

It also has it listed as a cursive family in the css, as opposed to serif
font-family: 'Baloo Chettan', cursive;

You also seem to have an extra quotation mark in your link


#7

Also, there isnt a font-align property. It should be text-align


#8

Ah - thanks guys. I thought I’d read that it was a - not a +. Changed it and it worked :slight_smile:

With regard to the ‘serif’ in the style sheet, I didn’t think that was related to the font you selected, but what you want the font to default to if the browser can’t display the first one you want.