Line height differs from online TypeKit font vs. local embedded CSS font

[devospice]

We are developing a Veeva presentation (think HTML-based iPad app) and our designers used a TypeKit font.  Unfortunately TypeKit requires the user be connected to the internet and we can't ensure that so we needed to embed the fonts directly in the CSS.  So we licensed the font in question (Avenir), got the package, and inserted it into the HTML.  What we found was that the line-height differs substantially between the two fonts causing all the elements to shift up.

This is literaly the only difference.  One links to TypeKit online.  The other uses local embedded fonts.  I have attached an animated GIF showing the difference  The local fonts appear much higher than the embedded fonts.  Unfortunately this is a HUGE presentation and adjusting the line-height of each element manually will take more time than we have to finish this project.

Has anyone run into this problem before?  Any idea what might be causing it or how to fix it?

[devospice]

Slight correction.  The font in question is Acumin Pro, not Avenir.  Avenir is also used in the app.

[Nancy OShea]

I would say the difference is nearly imperceptible. 

Have you tried disabling all CSS to see if that has any effect?

[Frank Grießhammer, AF]

This difference is not “imperceptible”, but very alarming.

Could you please detail which browser you are using? There might be a change in how that browser handles vertical metrics, the effects of which were also reported for acumin.typekit.com

[Frank Grießhammer]

I replied here yesterday while accidentally making an orphan account. Just to confirm – yes, this response indeed comes from an Adobe employee.

[devospice]

Those screenshots were taken from Chrome running locally.  Veeva runs in an iPad app using a webview, which I believe uses the same webkit rendering engine.

[devospice · Accepted solution]

OK, after reaching out to the type foundary where we got the fonts from they reached out to their contact at Adobe and told them what was happening.  Adobe's reply included this: "If the customer created their web project between January 6th and January 21, we had a known issue with our metrics having differed from what we usually served on the web."  They then supplied us with new fonts which I place in the app.  The new fonts match perfectly, so our problem has been resolved.  

I'm just posting here in case anyone else ever runs into this.