CSS partial selector for defeating Flash of Unstyled Text
If you use the Adobe/Typekit webfontloader code (https://github.com/typekit/webfontloader) to load fonts from different providers, then the flash of unstyled text has probably reared it's ugly head.
There is a sweet piece of CSS that you can drop in, to prevent this from happening:
[class*="-loading"] {
visibility: hidden;
}
This is a partial match for classes containing -loading, which is applied in the html
element (appended to the font name).
You might want to apply this to both the html element only and then target text elements within the page to make this more performant.
Written by Nathan Monk
Related protips
Have a fresh tip? Share with Coderwall community!
Post
Post a tip
Best
#Css
Authors
Sponsored by #native_company# — Learn More
#native_title#
#native_desc#