Tell us what’s happening:
Hey everyone!
I’m recently building my product page in the HTML/CSS course. So far, so good.
At the moment I am working on the design and I want to add some google fonts. I thought I knew how it’s working, and I got it to work before in other projects, but this time it just doesn’t want to
So I put the code, that google fonts generated in the head section, like this (I just give you the whole head section):
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link
rel="stylesheet"
href="https://use.fontawesome.com/releases/v5.8.2/css/all.css"
/>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Licorice&display=swap" rel="stylesheet">
<link rel="stylsheet" href="./styles.css">
<title>Plantbox Product Landing Page</title>
</head>
The css just looks like this so far:
h1 {
font-family: ‘Licorice’, cursive;
}
I also tried adding the font-weight, changing the html code to only one font-weight…
The only thing happening is, that the font of the heading changes to a cursive font, by default (hope that’s the correct term). It doesn’t change into the handwritten one I want it to be. And I just wonder - why is that. Is it because my browser can’t work with that? But it doesn’t make any sense to me, since it has worked before with a different font. Or is there a mistake in the code?
I mean… I would think that it should work, if you use the exact code, that google gives you
If someone has an idea or knows what the problem is, I would be veeeerrryyy happy to know! Thanks!
Your browser information:
User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:109.0) Gecko/20100101 Firefox/112.0
Challenge: Product Landing Page - Build a Product Landing Page
Link to the challenge: