I'm able to embed and style a font-face in a webpage to view on Android and iPhone, and it works fine. However, it will not render on Windows Phone 7.5.
I've tried embedding the font into the CSS:
@font-face {
font-family:'MyFont';
src: url(data:font/woff;charset=utf-8;base64,d09GR...
}
...and also provided eot / ttf files, using a declaration that works across all other browsers -
@font-face {font-family:'MyFont';src:url('../fonts/MyFont-webfont.eot');src:url('../fonts/MyFont-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/MyFont-webfont.svg#MyFontRegular') format('svg'), url('../fonts/MyFont-webfont.woff')format('woff'), url('../fonts/MyFont-webfont.ttf') format('truetype');font-weight:normal;font-style:normal;}
...but still no luck. I can't believe that the new Windows phones do not allow for font embedding, and only support a limited list of fonts, as mentioned in:
http://msdn.microsoft.com/en-us/library/hh202920%28v=vs.92%29.aspx
Even if it's a Javascript rendering solution, any insight / hints or tips would be great...there must be some kind of workaround!
According to this blog post it's one of the "17 differences" between IE9 and IE9 on WP7.
And here's the MSDN article which officially confirms it.
I was successful in using Cufón to display custom fonts on IE in WP 7.5. Typeface.js did NOT work.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With