I've created a widget which allows the user to locate free-text over an image using a textarea. When saving the image a background canvas application reads the text and calculates its position, then it draws the text to the canvas over the image and saves a new image file. The font I use for this widget is league-gothic which I am importing using the @font-face method.

This seems to work great and without any issues on all browsers except (of-course) for IE9 and IE10. When using internet explorer you can clearly see that the font was indeed loaded since the textarea uses the same font, but when trying to draw the text onto the canvas the font-family reverts to one of its fallback, in this case Arial.

I've searched quite a bit and found nothing. Unlike most font issues I found that concern the canvas element, I am completely sure that the font has indeed loaded as I am viewing it before saving the result.

Anything at all will help me at the moment. If you have any insight, experience with similar bugs or whatever, please share :)

Thanks in advance.

P.S.

I can't expose a code example at the moment, but if it becomes a problem I'll do my best to provide one.