CSSで指定したフォントサイズを使ってくれないときの対処

how-to-order_1

お客様からレイアウトが崩れるというクレームがあって、IE7、IE8、Firefox、Chromeで調べてみたんだけど、こっちでは全然再現せず。
打合せのついでに訪問して確認してみたら、確かにずれてる。

how-to-order_2

でも、なんか字が大きくて変だ。
IE8の設定（ツール ≫ インターネットオプション ≫ ユーザー補助）を確認したら『Webページで指定されたフォントサイズを使用しない』になってた。orz…
でも、お客様がわざわざこれを設定してるということは、一般的なWebサイトの字が小さくて見ずらいということだろうから、うちのサイトを見るときだけ設定変えてくれというわけにもいかず。


if (jQuery("#notice a").attr("offsetHeight") > 15) {
  jQuery("#notice").css("left", "670px");
}

苦肉の策でこうしました。
#noticeブロックは position absoluteで配置してあるので、#notice aの文字の高さがCSSで設定した高さ（ling-height:14px）を超えているようなら、もう少し左から書くようにすると。
こうやっても、表示の文字サイズを大とか最大とかにされると同じようになるんですけど、それは自分で調整可能なので。
（あと、ちゃんとやるなら、offsetHeightの値から文字サイズを判定して、leftを変えればいいんですけど、とりあえずはこれでOK）

/作成者: