Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

CSS

Font Styles Not Applying on Website

Edit: ANSWERED!

I'm going through the Website Development track, first section, and am on the bit where you go to Google fonts and link them into your index.html (below normalize.css and above main.css) so you can use them for styling in main.css.

Now, I started off finding fonts I liked, linking them using the <link that google provided, and then using the exact code I was shown in the video, but with my font name. It didn't work. Then I tried exactly what google provided. It didn't work. So then I replicated exactly what the video showed, his fonts choice, italics, code, everything. The only thing that has elicited a change in font is when I removed the , sans-serif section of the code, and the title defaulted to Times New Roman.

Just trying to figure out where I've gone wrong here. Any assistance is helpful!

My code (The formatting here looks a lot different from how it does in my workspace, but not sure how to change that.):

index.html: http://codepen.io/anon/pen/iKBjE.html main.css: http://codepen.io/anon/pen/iKBjE.css

Hi Jennifer,

For code formatting you would use single backticks to wrap short pieces of inline code and you would use 3 backticks for a code block.

See this post: https://teamtreehouse.com/forum/posting-code-to-the-forum

5 Answers

You don't have the normal straight quotes in your code.

You have font-family: ‘Changa One’, sans-serif;

Should be font-family: 'Changa One', sans-serif;

That could be your problem. I'm not sure how they got in there like that.

Syed Rahman
Syed Rahman
2,609 Points

If you are 100% sure that the link is correct, then make sure if you have closed the braces properly and did not forget semi-colon somewhere. The google font page should also tell you how to name the font in the css. So check that too Copy and paste your code here, I will see if I can find anything. I am stage 4 of CSS now. Good luck!

Just added the relevant code. Not sure how to post the whole page cleanly, if that was needed.

raymond dustin
raymond dustin
4,739 Points

If you show us your code it will be easier to help you!

Just added the relevant code. Not sure how to post the whole page cleanly, if that was needed.

raymond dustin
raymond dustin
4,739 Points

From that it is really hard to tell what the problem is.... One thing I see is your are targeting an h1 tag but where is that h1 tag. Try to change the color of the h1 tag and see if the font color changes. If it doesn't you may need to be more specific in what you are targeting. for example....

body h1{ font-family: 'Changa One';

}

If you could post the entire code it would help alot.

Just figured out how to work CodePen. Both my index.html file and my css code are linked

I have to assume it was google, since I directly copy & pasted. Issue resolved. Thank you! I had no clue that was even a thing.