4 ms·

I was tinkering with @font-face in a project website I was working on. It's pretty cool, but unfortunately Firefox renders the text using the fallback font unti

I was tinkering with @font-face in a project website I was working on. It's pretty cool, but unfortunately Firefox renders the text using the fallback font until the font specified via @font-face has loaded, resulting in some ugly snapping around as the various fonts are loaded. I hear its fixed in Firefox 4.0, though, so I think I'm going to hold off on @font-face until its out of beta.

retlehs 16y ago
That's called FOUT (flash of unstyled text) http://paulirish.com/2009/fighting-the-font-face-fout/ http://paulirish.com/2009/fighting-the-font-face-fout/ describes two different methods you can use to fight it -- I prefer the first where you hide content till load (or 3 seconds) in FF 3.5+ Last time I tested the FF4 betas the FOUT was still present.
- jayroh 16y ago
  Between modernizr and the google font loading engine it's pretty easy to handle the FOUT issue. It's a pain in the ass, but manageable after a little tinkering.
- Samuel_Michon 16y ago
  Useless factoid: "fout" means "error" in Dutch. Seems appropiate. The term 'FOUT' is actually a nod to a ten year old bug named 'Flash of Unstyled Content' (FOUC). It occurred in early versions of Internet Explorer. One would first see unstyled content while the CSS was still loading. http://bluerobot.com/web/css/fouc.asp/ http://bluerobot.com/web/css/fouc.asp/