Line-height works differently on Mac and Windows

Question

I have text with a non-web font, I used @font-face for this.

It works fine in all browsers on Windows, but is aligned on top in all browsers on a Mac.

enter image description here

The blue box in this image is the line height.

I found this similar question , but it does not provide a workable solution.

+7

css css3 font-face

Alok jain Aug 9 '13 at 14:17

source share

2 answers

Marvinvk · Answer 1 · 2016-08-21T10:32:04+0000

If resolved using a different font, the problem is with the font, not CSS.

Font squirrel has an option under "expert", where you can check "Auto-tuning vertical indicators", this may work for you.

ant45de · Answer 2 · 2015-06-14T12:11:23+0000

try the css attribute "vertical-align: middle", this may solve the problem.