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?
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.