Font-face declaration in css doesn't work?

Up vote 1 down vote favorite 2 share g+ share fb share tw.

I'm helping my sister convert a website that somebody did for her in flash into html. They use fancy fonts in the flash that I am trying to define in a css file through @font-face. I tried opening the page in firefox, IE and chrome, but nowhere do I see the proper font.

The declaration that I am using is: @font-face { font-family: "VAG Rounded"; src: url("judith.huinink.net/chilax/VAGROUNL.OTF"); } judith.huinink.net/chilax/index.htm contains the html. judith.huinink.net/chilax/chilax.css contains the full css. I checked that I can download the font file, but it simply doesn't use the font when I open the page in a browser.

I must be overlooking something. Does anybody have any suggestions? Html css fonts link|improve this question asked Feb 18 '09 at 19:40Jeroen Huinink995514 78% accept rate.

It works for me (Safari 3.2.1/Mac). – Gumbo Feb 18 '09 at 19:43.

Update In the last year, browser support for fonts has improved rather dramatically. I'd suggest reading Tim Brown's excellent article on the subject, which describes in detail how to get web fonts working in most modern browsers. Original answer In realistic terms, @font-face is completely unusable right now.

Only two browsers support it — Internet Explorer for Windows, version 5 or better, and Safari 3.1. Worse, IE and Safari do not support the same font formats. IE supports only EOT, while Safari instead supports the more common TrueType (.ttf) and OpenType (.otf) formats.

3 @font-face now supported by IE, Firefox, Safari, Chrome and Opera – Jon Winstanley Feb 12 '10 at 17:28 Well, this question was asked a year ago. :-) – Ben Blank Feb 13 '10 at 19:19 That's why it's a useful comment! – Henry Gomersall Dec 8 '11 at 14:31.

Font-face goes mainstream As of January 2010 all major new browsers support font-face Safari 3.1 IE - all versions Firefox 3.6 Chrome 4 Opera 10 See http://webfonts. Info/wiki/index. Php?

Title=@font-face_browser_support.

Almost no browsers support @font-face: When can I use...

Nice resource, thanks! – dalbaeb Feb 18 '09 at 20:02 2 This anser is now incorrect, almost all browsers support font-face – Jon Winstanley Feb 10 '10 at 13:02.

How to use @font-face in all browsers that support it: at Jon Tangerine's blog ttf2eot is a nice font converter for Unix and Windows so you don't have to use the horrible old Microsoft WEFT. It converts the whole font, not just some characters. Here's a javascript to use with sIFR that disables sIFR for @font-face enabled browsers.

Flash needs to die, so here's another alternative to sIFR: facelift. It's a serverside script that generates images. The problem with afaik all sIFR replacements is that selecting and copying text doesn't really work -- you either don't see the selection, or it's impossible to select less than a word or line.

There's also Cufón which uses , so it only works on newer browsers, most of which have @font-face anyway. Do the right thing, use the state-of-the-art technology now: @font-face with TTF or OTF, and fallbacks for IE and old browsers. Preferably keep your HTML clean and implement those fallbacks in separate javascript and CSS files.

For IE you might need to use "conditional comments" as explained in my first link above. For browsers with javascript disabled, always specify a list of replacement fonts with the web-safe fonts at the end.

Check out the ever popular sIFR or with no flash dependency, typeface.js.

I've come across situations where WWW must be included in the domain. Without it, it wouldnt work.

I cant really gove you an answer,but what I can give you is a way to a solution, that is you have to find the anglde that you relate to or peaks your interest. A good paper is one that people get drawn into because it reaches them ln some way.As for me WW11 to me, I think of the holocaust and the effect it had on the survivors, their families and those who stood by and did nothing until it was too late.