Search code examples
cssinternet-explorerinternet-explorer-8internet-explorer-7stylesheet

Cross-browser base64 webfonts support


aborts the EOT file loading progress sometimes, so the font does not load correctly.

  1. There is a abstract solution with eotfast & mhtml, but it's not supported within IE7+8.

  2. The regular base64 method works pretty nice, but for IE9 only:

    src: url('data:font/eot;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAggg=='); /* IE 9 */

What's the common solution, to implement inline opentype webfonts for +?


Solution

  • Data URLs are not supported for Internet Explorer 7
    More details on DataURL support

    In this case, use conditional comments to serve non DataURL font to IE7 and lower:

    <!--[if (lte IE 7)]>
        <link rel="stylesheet" media="screen" href="css/fontface-ielt8.css" />
    <![endif]-->
    

    Internet Explorer 8 has a DataURL size limit of 32KB

    If your font doesn't show up in IE8, this may be the reason.
    Then try to modify the font via fontsquirrel (expert mode) or another application to cut down the font size.

    Hope this helps.