Information

Found out the hard way in my last job that font downloads can be blocked. See Font Awesome Problem with IE8 when security option "font download" is disabled.

For regular fonts, this is an inconvenience—the fallback font will kick in and text can still be used. For an icon font, you're left with nothing (or ugly boxes!)

Here's one alternative. Embed the SVG icons in your CSS! You can grab the font-awesome SVG source from this repo: https://github.com/encharm/Font-Awesome-SVG-PNG

Notes

• SVG required (IE9+)
• :before (CSS2) vs ::before (CSS3)
• Printing supported
• Text alignment is a little tricky
• Color inheritance is difficult (not possible without duplicating color value in SVG markup?)