Applying custom font to header - font doesn't change

Frontend Web Development: The Big Nerd Ranch Guide Chapter 3: Styles
1

Everything’s gone well for me in this styling chapter, until I got to the @font-face declaration for the lakeshore font family. My code is all correct, but the logo-text header font didn’t change. The fonts folder is inside the stylesheets folder. Maybe I made a coding error that I haven’t noticed yet? Thanks for your help.

@font-face {
font-family: ‘lakeshore’;
src: url(‘fonts/LAKESHOR-webfont.eot’);
src: url(‘fonts/LAKESHOR-webfont.eot?#iefix’) format(‘embedded-opentype’), url(‘fonts/LAKESHOR-webfont.woff’) format (‘woff’), url(‘fonts/LAKESHOR-webfont.ttf’) format(‘truetype’), url(‘fonts/LAKESHOR-webfont.svg#lakeshore’) format(‘svg’);
font-weight: normal;
font-style: normal;
}

EDIT: I copied and pasted the @font-face code from the book and it worked! But the code looks the exact same as mine (shown above) – what is my error??

2

Hi @sleepycat, the error is really subtle! I didn’t catch it until syntax highlighting showed which line was not quite right.

It looks like you have an extra space in format ('woff') which should be format('woff')

:crossed_fingers:

3

Oh man. Thanks @nybblr! I guess the way my Brackets editor is currently set up doesn’t help with this issue.