ご無沙汰しております。

お仕事が忙しくて、しばらく放置しておりました。

気が付きゃ前回のエントリーから早や1ヶ月。

ウェブフォント(Web Font)について。”という記事から更新していなかった。

その時はChromeとIEで確認してともにウェブフォントが正しく表示されていたので“ヨシ”としていた。

で、たまには気分を変えてFireFoxで閲覧しようとしたら、、、

超ゴシック体。

バージョンは2012年6月26日現在で最新バージョンの13.0.1。

ちなみにOpera(ver.12.00の最新版)で確認しても、ダメ。

Safari(ver.5.1.7)はOK。

なぜ?

早速ググってみたところ。

CSS◆WebFontsがFireFoxで表示されなかった件。
http://wood-built21.net/mytips/oboegaki/archives/2011/0714_140355.html

ここでは、フォント指定のURIがクロスドメインになっていたことが問題だったみたいだが、当サイトは違う。

しばらくワケが分からなかったが、ふとIE用のウェブフォント指定とその他のモダンブラウザ用のウェブフォント指定の順番を入れ替えてみた。

@font-face { /* for IE */
  font-family: 'あんず文字';
  src: url("/font/APJapanesefont.eot");
}

@font-face { /* for IE(>=9), Firefox(>=3.6), Safari(>=5.1), Chrome(>=6), Opera(>=11) */
  font-family: 'あんず文字';
  src: url("/font/APJapanesefont.woff") format("woff");
}

、、、ちゃんと表示されたよorz。。。

どうやらFireFoxとOperaでは、この順番を逆にするとwoffフォントがあとから読まれるIE用のeotフォントに上書きされるみたい。

ググっても、このことはあんまり重要視されていないみたいだけど、、、単なるボクのググり不足?

まあ、どっちにせよ解決したからいっか。