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

CSS

Posted by JoJo KoKo
JoJo KoKo
4,712 Points

Font "Nunito" is not being set :(

From style.css I have the body:

body {
    font-family: 'Nunito', sans-serif;
}

From the head of index.html I have the following to get and use this font:

  <link href='http://fonts.googleapis.com/css?family=Nunito' rel='stylesheet' type='text/css'>
  <link rel="stylesheet" type="text/css" href="css/style.css" media"screen">

Anyone see a problem with this?

Jesse Richard
Jesse Richard
1,899 Points

Assuming nunito is a google font, or some other web font, are you including the font link in the html or using an @import in the css?

(You might have added in in your post but it's not showing up in the question)

The css syntax looks correct.

JoJo KoKo
JoJo KoKo
4,712 Points

Thanks... I've added the link to the web font

Jesse Richard
Jesse Richard
1,899 Points

This site really needs to allow people to share their workspaces.

4 Answers

Jesse Richard
Jesse Richard
1,899 Points
Jesse Richard
Jesse Richard
1,899 Points

I think the media"screen" is the problem. It should be media="screen".

Guillermo Arias
Guillermo Arias
8,006 Points
Guillermo Arias
Guillermo Arias
8,006 Points

Did you write correctly media="screen". You forgot to put the equal sign. Try this <link href='http://fonts.googleapis.com/css?family=Nunito:400,700,300' rel='stylesheet' type='text/css'>. The style.css file is in the css folder

JoJo KoKo
JoJo KoKo
4,712 Points
JoJo KoKo
JoJo KoKo
4,712 Points

changed to media="screen" but there was no change :(

Jesse Richard
Jesse Richard
1,899 Points

Try removing html body and using a global *.

  • { font-family: 'Nunito', sans-serif; }

This will, at the very least, help debug the source of the problem. This should set the font for all elements to nunito. If this work you know the css syntax is correct and that the nunito css file is loading correctly from Google Fonts.

JoJo KoKo
JoJo KoKo
4,712 Points
JoJo KoKo
JoJo KoKo
4,712 Points

Found the problem... it was paging problem and not reading the file for some reason ;( Had to rest browser and text editor... Thanks for the help :)

Jesse Richard
Jesse Richard
1,899 Points

Browser caching? If so - turn it off forever.