Search code examples
font-face

@font-face correctly loaded but page do not render in chrome

I'm facing a weird issue with chrome.

I'm loading a custom font with @font-face:

@font-face {
font-family: 'AlexBrushRegular';
src: url('AlexBrush-Regular-OTF-webfont.eot');
src: url('AlexBrush-Regular-OTF-webfont.eot?#iefix') format('embedded-opentype'),
     url('AlexBrush-Regular-OTF-webfont.woff') format('woff'),
     url('AlexBrush-Regular-OTF-webfont.ttf') format('truetype'),
     url('AlexBrush-Regular-OTF-webfont.svg#AlexBrushRegular') format('svg');
font-weight: normal;
font-style: normal;

}

I've used the Font Squirrel Font Face generator, with the demo page it works well.

But when i put this css and the font in my app (one-page app with require.js) , the page doesn't render. The font is correctly loaded (200 OK on the request) :

networkpaneldevtool I think it's a chrome related issue because it works well with Safari.

I've tried loading my page without local server: file:///www/index.html, and it works in Chrome.

Any inputs appreciated.

Thanks.

Thibault

Solution

  • Seems it's fixed in the current version of Chrome