본 사이트는 여러분의 사용자 경험을 개선하기 위해 유지 보수를 진행하는 동안 기능이 제한됩니다. 도움말로 문제가 해결되지 않고 질문을 하고 싶다면 Twitter의 @FirefoxSupport 및 Reddit의 /r/firefox 채널을 활용하세요.

Mozilla 도움말 검색

고객 지원 사기를 피하세요. 저희는 여러분께 절대로 전화를 걸거나 문자를 보내거나 개인 정보를 공유하도록 요청하지 않습니다. "악용 사례 신고"옵션을 사용하여 의심스러운 활동을 신고해 주세요.

자세히 살펴보기

Why does CSS' "@font-face" not work in FF8.0?

  • 5 답장
  • 6 이 문제를 만남
  • 3 보기
  • 최종 답변자: cor-el

more options

I am using embedded fonts via CSS' @font-face, which works perfectly in IE9, Safari 5.1.1 and Opera 11.52. However it does not work in FF8.0 (or Chrome 15.0.874.121) and falls back to Verdana.

Here is my CSS:

body,td,th { font-family: DragonwyckFont, Verdana, Geneva, sans-serif; }

@font-face { font-family: "DragonwyckFont"; src: url("../fonts/Dragonwyck_Normal.eot"); src: url("../fonts/Dragonwyck_Normal.eot?#iefix") format('embedded-opentype'), url("../fonts/Dragonwyck_Normal.ttf") format('truetype'); }

This is being tested on a W7 box, using localhost: on IIS.

Any help or advice would be much appreciated.

Thankyou in advance.

I am using embedded fonts via CSS' @font-face, which works perfectly in IE9, Safari 5.1.1 and Opera 11.52. However it does not work in FF8.0 (or Chrome 15.0.874.121) and falls back to Verdana. Here is my CSS: body,td,th { font-family: DragonwyckFont, Verdana, Geneva, sans-serif; } @font-face { font-family: "DragonwyckFont"; src: url("../fonts/Dragonwyck_Normal.eot"); src: url("../fonts/Dragonwyck_Normal.eot?#iefix") format('embedded-opentype'), url("../fonts/Dragonwyck_Normal.ttf") format('truetype'); } This is being tested on a W7 box, using localhost: on IIS. Any help or advice would be much appreciated. Thankyou in advance.

모든 댓글 (5)

more options

Maybe it is caused by the ../ Does it work if you place the fonts in the same directory as the CSS file or if you use a full path that starts with the root (http://xxx.com/path/fonts/Dragonwyck_Normal.ttf)?

You may also need to send special access headers.

more options

Hi cor-el,

Thanks for your very quick reply, unfortunately the solutions you offered have been unsuccessful.

I did as you suggested (including deleting the relative path and placing the fonts in the same directory as the CSS) and followed all the advice given in the references you made.

I am not going across domains so Access Control Headers are not required.

Bizarrely, the link from the demo (https://developer.mozilla.org/en/CSS/@font-face) works perfectly but, when I replicate it using the full path to Dragonwyck_Normal.ttf, it doesn't.

My little brain is starting to fry and I must be doing something completely daft but, with just half a dozen lines of code, I fail to see how it could be more simple!

CSS: body,td,th { font-family: "Dragonwyck", serif; }

@font-face { font-family: "Dragonwyck"; src: url("Dragonwyck_Normal.ttf"); }

Any ideas?

Regards,

Chaindrive.

글쓴이 Chaindrive 수정일시

more options

You can try to check the font in case there is a problem with it.

Can you post a link?


A good place to ask advice about web development is at the mozillaZine Web Development/Standards Evangelism forum.
The helpers at that forum are more knowledgeable about web development issues.
You need to register at the mozillaZine forum site in order to post at that forum.

See http://forums.mozillazine.org/viewforum.php?f=25

more options

Cor-el, thank you!

The Fontface Generator worked perfectly!

I still am not sure why it should work in IE and the others but not FF but, hey-ho, I'm not going to worry too much about that at this time.

Once again, thanks for your help - very much appreciated!