0

I am trying to wait for fonts to load before rendering my web page. One suggest that converting to base64 could be the best solution by this answer. So I converted using fontsquirrel webfont generator(also chose Truetype Hinting: Keep Hinting) and used in my file as

@font-face {
  font-family: "Montserrat";
  src: url(...) format("woff"), url("montserrat-regular-webfont.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
 }

But when I check on webpage, the original spacing of the font are removed.

This is before using base64

enter image description here
And this is after using base64

enter image description here
As you can see, spacing are removed, how do I prevent this ?

Kaung Khant Zaw
  • 1,508
  • 3
  • 19
  • 31

1 Answers1

1

The issue is with Font Squirrel as they discussed in github. While generating in their http://fontsquirrel.com/tools/webfont-generator, enabling to No Adjustment for Vertical Merics:(in Expert) fixes the issue.

Kaung Khant Zaw
  • 1,508
  • 3
  • 19
  • 31