If you use FontSquirrel to generate @font-face kits you may have noticed that they abandoned the Smiley method of generating CSS in favor of newer methods like FontSpring or Mo Bulletproofer. This is great because CSS generated by FontSquirrel will now successfully render fonts in browsers on Android devices.
What if you want to update existing declarations to be Android-friendly? Instead of regenerating the entire @font-face kit, you can simply update your @font-face declarations manually to support Android devices. Here’s a code snippet to get you started:
@font-face {
font-family: 'MyFont';
src: url('MyFont.eot?') format('eot'), url('MyFont.woff') format('woff'), url('MyFont.ttf') format('truetype'), url('MyFont.svg#webfontwTBKaDwa') format('svg');
font-weight: normal;
font-style: normal;
}
BAM!
This is great news! I tried it last year and it wasn’t working, and now… GREAT!
Thanks for the update Brian
This does not work in internet explorer for me, and no matter how I do it in my external css file will it work in IE for me.
I find myself needing this in the main document:
@font-face {
font-family: Gill Sans MT;
src: url(‘template/fonts/GillSansMT.eot’);
}
well that cut out my bit there. but it should show that statement.
I tried it works in android!! Great man it saved a lot of time and efforts. Thanks again for great work!
Font squirrel now generates them in the following manner:
@font-face {
font-family: ‘UndercoverRegular’;
src: url(‘UNDERCOV-webfont.eot’); /* IE9 Compat Modes */
src: url(‘UNDERCOV-webfont.eot?#iefix’) format(‘embedded-opentype’), /* IE6-IE8 */
url(‘UNDERCOV-webfont.woff’) format(‘woff’), /* Modern Browsers */
url(‘UNDERCOV-webfont.ttf’) format(‘truetype’), /* Safari, Android, iOS */
url(‘UNDERCOV-webfont.svg#UndercoverRegular’) format(‘svg’); /* Legacy iOS */
font-weight: normal;
font-style: normal;
}
In essence, it seems like they got rid of the bulletproofing but the format of eot should be changed to ‘embedded-opentype’.
thnx Brain,
this was really helpful.
Does it support andorid 2.2
Nice!! work for me! thanks