Line-height in iOS (otf or ttf) is being applied from the bottom, rather than from the center

[gilluminate]

The default line-height is 150%, and we can’t change that line-height without it getting messed up. FWIW I had the same problem on web until I found a newer version of the web font (woff2). Unfortunately, it doesn’t look like there’s a newer otf or ttf with the fix. I have attempted using fonts downloaded from both productiontype.com as well as from Google.

To illustrate what is happening, here is a screenshot, with the following React Native styles applied to it:

  font-size: 32px;
  line-height: 32px;
  border-width: 1px;

You can see that the line-height doesn’t get applied from the center, but rather from the bottom for some weird reason.

Here’s that same exact styling, but with a different serif font from Google (Merriweather):