@font-face use

[djjkps3]

I'm trying to use @font-face in an external style sheet to use a custom font. But it's just making my text invisible. Here is the code in my external style sheet.

@font-face {
font-family: customfont;
src: url('LEVIBRUSH.TTF');
}

#title{
text-shadow: #000000 2px 0px 20px;
font-size: 100px;
font-family: customfont;
color: red;
}

The font is in the same directory as the external stylesheet

[bbang]

is the font name in all caps?

[djjkps3]

Yep, I made sure to name it exactly the same, including the extension

[h2ooooooo]

[url]www.fontsquirrel.com/fontface/generator[/url]

I tend to use this tool. It's pretty cool.

[Catdaemon]

What browser are you using? Some only support the .eot extension, some .ttf, etc.

[Maccabee]

[QUOTE=h2ooooooo;29333672][url]www.fontsquirrel.com/fontface/generator[/url]

I tend to use this tool. It's pretty cool.[/QUOTE]

Yeah this awesome. One thing that really bugs me about embed fonts is that annoying .5 of a second flash you see of the old font before the embed font is loaded. I look around and ready that using google's web font loader: [url]http://code.google.com/apis/webfonts/docs/webfont_loader.html[/url] fixes this problem. I haven't tried it out though.

[TheDecryptor]

[QUOTE=Catdaemon;29335149]What browser are you using? Some only support the .eot extension, some .ttf, etc.[/QUOTE]

Only IE8 and lower supports EOT, the rest support WOFF/TTF/OTF (Including IE9+)

[Kwaq]

I have a few good fonts that are .FON format. Is there a way I can use them? (Tried and failed)

[Rashy]

Use Woff format. "Cross-browser, web-only font format that uses gzip compression. IE9+, FF3.6+, Chrome 5+"