Fonts gets loaded after mouseover html tag

Question

When page of my application is loaded font in some html tags is default one and when you mouse over it, proper font immediately shows. I made a list of things that probably matters:

• Position of element doesn't matter, it occurs on absolute and static.
• Font of my choice if assigned to body tag so there is no way some stylesheets don't get loaded.
• I load fonts via @import from fast.fonts.net. This line of code is almost on the top of my stylesheets, above is only reset.
• I load my assets from s3, minified in one file.
• It never occurs locally and the only browser that this bug was seen is Chrome.
• It is rare bug, maybe 1% of all page refresh, so reproducing when you want to see it is difficult
• Once I have seen this issue in bugsnag.com
• App is heavy on front-end side

Do you have any ideas how I could fix it?

Answer 1

I discovered that injecting fonts via JS script tag and not css @import works best. After that client stopped reporting me this issue.

It's simple change and the reason why it works must be connected with some Chrome bug.