NotoフォントをIEで使うと見切れる

一時期の趣味がすてきなフォント探しでした、デザイナーの澁谷です。
好きなフォントはAdobe&Googleの「Notoフォント」、最近のお気に入りフォントはモリサワの「見出ゴ」です。

そんな大好きなNotoフォントを使用したサイトを制作していたときのこと。
ブラウザチェック時に気付いてしまいました。
IEで見た時だけ、見出しが見切れている…!

なぜ?と調査したところ、
「Noto系のフォントは、ディセンダー(文字の下のスペース)が広めに取られている!」
ことが原因でした。
イラストレーターなどで開くと分かりやすいです。

40pxの見出ゴ。
noto_01

同じ40pxの源ノ角ゴシック。源ノ角ゴシックはNotoフォントの日本語名です。
noto_02

なんか広い!

結局IEハックでline-heightやpaddingを調整しました。

この記事をシェアする