Font won't show up? :(

Help please?

Why the font on the heading isn’t applying?

I recommend putting your external stylesheets (such as Bootstrap) in the CSS settings, because stylesheets added in the HTML editor via <link> tags are loaded last (and override your custom CSS).

Then you should wrap the font name in single quotes ('Croissant One') since it has a space in it (but iirc it’s conventional to use single quotes for web fonts, even those with only one word). You may also want to provide a suitable fallback font family.

1 Like


Thank you for your answer!

When I put the bootstrap in the CSS, it won’t load the buttons as they should :confused: you mean this text right? <link rel="stylesheet" href="//"/>

I also tried wrapping the font name the way you told me and nothing happened :frowning:

What is a “fallback font family”?

Open your CSS settings and put the externals there like this:

Then you can remove the <link> tags in the HTML.

It’s like this:

h1 {
  font-family: 'Croissant One', sans-serif;

If ever the Croissant One font is not available, the page will use the next one (sans-serif), and so on.

1 Like

Ooooh I didn’t know I had to do that each time :confused: Also thought that if I had it as text on the HTML it would work like in the examples…
It worked!!! Thank you so much :smiley: :tada: :tada: :tada:

You have to be careful about things like this in Codepen. At the end everything looks neat, but it can easily trip new people.

1 Like

@kevcomedia you’re right… I found the lessons so easy, but the projects are more complex haha… And not being able to peek makes it more difficult - but it makes us learn better.

I think I’ll redo all the lessons and take notes, i find myself having to revisit them every time.