Android 4.0 : no font displayed with local files #3632

cobaltians · 2014-06-05T15:01:05Z

I'm having a weird bug on Android 4.0.x devices using font-awesome embedded in a Cordova WebView.

When using CDN link, font is displayed.
When using latest release zip files font is not displayed.
No trouble with Android 4.1, 4.2, 4.3 or 4.4 with local files. iOs works great too.

Any idea ?

Here is my sample code :

I just downloaded the latest release files, put them into a css folder and renammed it "font-awesome-4.1.0" to avoid uppercases.

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0"/>
    <!--<link href="https://netdna.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">-->
    <link rel="stylesheet" type="text/css" href="css/font-awesome-4.1.0/css/font-awesome.min.css" >
</head>
<body>
    <h1>this should work, right ?</h1>
    <p><i class="fa fa-camera-retro"></i> fa-camera-retro</p>
</body>
</html>

commented line works great. local files don't. I need local files to allow my app to have icons offline.

The text was updated successfully, but these errors were encountered:

tagliala · 2014-06-05T16:53:57Z

@cobaltians take a look at our troubleshooting guide:https://github.com/FortAwesome/Font-Awesome/wiki/Troubleshooting#phonegap--android-icons-in-heading-tags Phonegap / Android (icons in Heading tags)

let me know if that fixes. Meanwhile, closing here

cobaltians · 2014-06-06T09:21:35Z

Hi, thank for the tip.
I tested it but it still doesn't work.

My Android 4.0 devices are :

Google Nexus S (4.0.4)
Amazon Kindle Fire (4.0.3)

I adapted my sample below :

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0"/>
    <!--<link href="https://netdna.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">-->
    <link rel="stylesheet" type="text/css" href="css/font-awesome-4.1.0/css/font-awesome.min.css" >
    <style>
        h1{ color:red;}
        /* FA 4.0.0 and newer */
        .fa {
        text-rendering: auto;
        }

        /* FA 3.2.1 and older */
        [class^="icon-"],
        [class*=" icon-"]  {
        text-rendering: auto;
        }
    </style>
</head>
<body>
<h1>this should work, right ?</h1>
<p><i class="fa fa-camera-retro"></i> fa-camera-retro</p>
</body>
</html>

Once again : everything works well with the CDN url. how is it possible ?

Any other idea ?

tagliala · 2014-06-06T09:28:21Z

@cobaltians you should use stackoverflow

cobaltians · 2014-06-06T09:55:38Z

Don't get me wrong, I'm not just trying to make font-awesome work and raising an issue on the first problem I meet.

I use font-awesome for a while now and the exact same code is working without troubles on (at least) this list of Android devices :

Samsung Galaxy Nexus (Android 4.3)
Nexus S (Android 4.1.2)
Nexus 4 (Android 4.4.2)
Samsung Galaxy S3 (Android 4.3)
Galaxy Tab 10 (Android 4.2)
Nexus 7 (4.3)
Nexus 7 (4.4)

... And iOs iPad, iPad mini and iPhones running ios 7 too. The exact same code.

I know it's hard to make a lib like font-awesome to work on every devices, and font-awesome team and contributors are doing a great job.

But Android 4.0 is still 12.3% of the android user base. Do you really want to let them behind ?

Do you think of any test I can do to find out the issue? How can I help you ?

I can provide anything, but please, don't let this issue die.

tagliala · 2014-06-06T09:58:30Z

reopening here, but I can't remember about other issues on Android 4.0 + cordova, so I was supposing a misconfiguration on your side.

Since newer platforms are working, it may be a bug of android stock browser. I don't know any workaround at the moment.

Could you please try other icon fonts?

cobaltians · 2014-06-06T16:34:32Z

thank you.
I made a few tests, hacking the lib itself and changing the order of ttf/woff/ogg fonts or removing the double "src" rule without success. I also tried with the "-webkit" rules off. same result.

Will try another web font soon (thuesday). Maybe just a classic one with basic charset too.

Do you think I should provide a full working sample code of an empty cordova project with your lib used inside or not ? Is there someone able to test on more Android 4.0 devices around there ?

tagliala · 2014-06-06T17:16:30Z

@cobaltians I don't know what to say... Android 4.0 came a lot of time ago and nobody reported this issue. Try to post here: #1094

jonmaim · 2015-01-27T05:20:24Z

@cobaltians I had a similar problem with font-awesome 4.2 in a cordova webview for windows phone 8. The problem only occurs when the FA files are loaded locally. In my case the solution was to remove all occurrences of ?v=4.2.0 from the @font-face property in the font-awesome.css file.

Maybe the problem you have on Android 4.0 is simlilar to this one? Let me know.

tagliala · 2015-01-27T09:27:29Z

let us know

cobaltians · 2015-01-29T18:16:27Z

Hi,
It works for Android 4.0.4 with local files too !! thanks a lot @jonmaim !

@tagliala : Any risk of removing these ?v=4.2.0 from the stylesheet ? Do you known the purpose of it?

tagliala · 2015-01-29T18:30:01Z

@cobaltians cache stuff from the old days, but now they are more harming than useful. Take a look at #3286

I should advise Dave to consider it for 5.0.0

PS: could you please edit our troubleshooting wiki and point to this thread? https://github.com/FortAwesome/Font-Awesome/wiki/Troubleshooting

jonmaim · 2015-02-03T11:17:29Z

Just added a section Fonts not showing up in Phonegap application (Android and Windows Phone) at the end of the wiki page https://github.com/FortAwesome/Font-Awesome/wiki/Troubleshooting

tagliala · 2015-02-03T12:24:30Z

thanks!

tagliala · 2015-02-03T12:25:04Z

Maybe we need an index

azachar · 2016-04-17T13:12:19Z

Hello All,

I have a similar issue, removing anything behind ? did not work. The path to the font is correct.
I am using Samsung Galaxy J5 with Android 5.1.1, any idea why it doens't work?

Thank you!

tagliala · 2016-04-17T13:24:40Z

@azachar https://github.com/FortAwesome/Font-Awesome/wiki/Troubleshooting#fonts-not-showing-up-in-phonegap-application-android-and-windows-phone

azachar · 2016-04-28T20:55:27Z

Thanks @tagliala, I tried that but it doesn't work neither.

tagliala closed this as completed Jun 5, 2014

tagliala reopened this Jun 6, 2014

tagliala added the waiting for feedback label Jun 6, 2014

tagliala closed this as completed Jan 29, 2015

tagliala removed the waiting for feedback label Jan 29, 2015

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Android 4.0 : no font displayed with local files #3632

Android 4.0 : no font displayed with local files #3632

cobaltians commented Jun 5, 2014

tagliala commented Jun 5, 2014

cobaltians commented Jun 6, 2014

tagliala commented Jun 6, 2014

cobaltians commented Jun 6, 2014

tagliala commented Jun 6, 2014

cobaltians commented Jun 6, 2014

tagliala commented Jun 6, 2014

jonmaim commented Jan 27, 2015

tagliala commented Jan 27, 2015

cobaltians commented Jan 29, 2015

tagliala commented Jan 29, 2015

jonmaim commented Feb 3, 2015

tagliala commented Feb 3, 2015

tagliala commented Feb 3, 2015

azachar commented Apr 17, 2016

tagliala commented Apr 17, 2016

azachar commented Apr 28, 2016

Android 4.0 : no font displayed with local files #3632

Android 4.0 : no font displayed with local files #3632

Comments

cobaltians commented Jun 5, 2014

tagliala commented Jun 5, 2014

cobaltians commented Jun 6, 2014

tagliala commented Jun 6, 2014

cobaltians commented Jun 6, 2014

tagliala commented Jun 6, 2014

cobaltians commented Jun 6, 2014

tagliala commented Jun 6, 2014

jonmaim commented Jan 27, 2015

tagliala commented Jan 27, 2015

cobaltians commented Jan 29, 2015

tagliala commented Jan 29, 2015

jonmaim commented Feb 3, 2015

tagliala commented Feb 3, 2015

tagliala commented Feb 3, 2015

azachar commented Apr 17, 2016

tagliala commented Apr 17, 2016

azachar commented Apr 28, 2016