Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

HTML How to Make a Website Customizing Colors and Fonts Pick Fonts and Set Relative Units

Justin Benton
Justin Benton
4,765 Points

Font is not changing from default

Working in CSS font styles and following along with the video, typing my code in the same place/way as shown, but when I go to view my updates the font hasn't changed. I'm not sure what is wrong as it seems pretty simple and straightforward. I copied the font link from GoogleFonts and pasted into my CSS Main file making sure it is below normaliz.css and above my own css stylesheet (as per the video). Here is the HTML code:

<link rel="stylesheet" href="css/normalize.css"> <link href='https://fonts.googleapis.com/css?family=Oswald|Arimo:400,400italic,700,700italic' rel='stylesheet' type='text/css'> <link rel="stylesheet" href="css/main.css">

Then in CSS style sheet, have entered the following (again, as per the video's example):

h1 { font-family: 'Oswald', sans-serif; }

When I preview my work, the h1 font is unchanged/still the default. Any ideas would be greatly appreciated.

Thank you!

Justin Benton
Justin Benton
4,765 Points

Please note: in my HTML the normalize css link, the google font link, and the css main stylesheet link are each on separate lines of code...they just ran together here in my question.

1 Answer

nulled
nulled
1,890 Points

I know it says otherwise, put try putting your font link and file before your CSS stylesheets (e.g. the Normalize CSS).

And trying indenting your CSS in your CSS file to prevent ambiguity. Such as:

h1 { 
  font-family: 'Oswald', sans-serif; 
}
Justin Benton
Justin Benton
4,765 Points

That seems to have worked; thanks!

This worked for me, as well. Thanks!