行の高さはMacとWindowsで異なる動作をします

私は非Webフォントのテキストを持っていますが、これには@font-faceを使用しました。行の高さはMacとWindowsで異なる動作をします

Windows上のすべてのブラウザで問題なく動作していますが、Macのすべてのブラウザで一番上に並んでいます。この画像で

enter image description here

ブルーボックスは、行の高さです。

this similar questionが見つかりましたが、実行可能な解決策はありません。

2013-08-09 Alok Jain

どちらのマシンにも問題のフォントがインストールされていますか？ちょうど最初の考え。 –

この他の投稿は[リンク]（http://stackoverflow.com/questions/21442910/line-height-not-vertically-centering-text-on-mac-but-looks-fine-on-windows） –

これがウェブフォントの場合は、フォントリス[Webfont Generator]（http://www.fontsquirrel.com/tools/webfont-generator）を使用して、フォントファイルの行高さの設定を正規化してみてください。それは "垂直の測定値（ブラウザ間で標準化）を修正する"オプションがあります。それはそれを修正するかもしれない（フォントに依存する） – feeela

-3

"vertical-align：middle"を試してみると、問題が解決する可能性があります。

出典

2015-06-14 12:11:23 ant45de

異なるフォントを使用して解決された場合、問題はフォントではなくCSSで問題になります。

フォントsquirrelには「専門家」の下に「自動調整垂直メトリック」が表示されるオプションがあります。

https://www.fontsquirrel.com/tools/webfont-generator

出典

2016-08-21 10:32:04 MarvinVK

行の高さはMacとWindowsで異なる動作をします

答えて

関連する問題