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 CSS Basics (2014) Enhancing the Design With CSS Web Fonts with @font-face

Jason Hellerman
seal-mask
.a{fill-rule:evenodd;}techdegree
Jason Hellerman
Front End Web Development Techdegree Student 6,447 Points

Font hasn't changed

I am unable to copy and paste in workspace so I typed the code for @font-face. Ive reviewed it and messed around with it a ton and just can't figure out what is wrong. Here is a snapshot of my css. Thanks in advance to any help!

http://w.trhou.se/996xk3vtqs

I had a similar issue with this so I did some further digging on some resources. After removing the 's and spaces from the declaration at the top of the style.css file and then from the properties and attributes in the h1, h2 selector then it seemed to work:

Declaration:

@font-face {
    font-family: AbolitionRegular;
    src: url(../fonts/abolition-regular-webfont.eot);
    src: url(../fonts/abolition-regular-webfont.ttf);
    src: url(../fonts/abolition-regular-webfont.woff);
}

h1, h2 selector:

h1,
h2 {
    font-family: AbolitionRegular, Helvetica, Arial, sans-serif;
}

Not sure if this is the correct way to do things as I'm still learning myself but it seemed to import the fonts back into the site.

Hope it helps!

1 Answer

Hi! Not sure if you still need a solution for this given that this was posted months ago, but the Abolition Regular font should be in single quotes instead of double quotes.