Phonegap app, font issue with 4.x androids

Question

I'm developing an app in phonegap and I'm now searching for days to solve this problem. I checked every other topic related to custom font faces but no one has already faced my problem.

The matters is that I want to show farsi fonts in my app. it works well in PC , android browser and phonegap apps in android 2.x and 4.4 (kitkat) but all I have in android 4.1 and 4.2 is default farsi fonts.

here is my code but I tried every other possible variations even using Base64 encoded fonts into my css.

    @font-face {
    font-family: 'B Yekan';
    src:url('../fonts/byekan.eot?#') format('eot'),    
          url('../fonts/byekan.woff') format('woff'),
          url('../fonts/byekan.ttf') format('truetype'); 
}

h2,h1,h3 {
    direction:rtl;
    font-family:B Yekan,'B Yekan'!importan;
}

I tried to move the fonts into asset folder or even put fonts near my css and index.html, no chance. I think it's a bug with android 4.x webview (except kitkat) but I have no idea what I can do for this. every kind of help is appreciated.

Answer 1

I experienced the same. The strangest of all is that if the font is applied to general tags like body or label it works! Just not when using the H or P tags. So it can't be a render or location issue, but I haven't found a solution yet either.

UPDATE:

It seems like Android 4.2 has an issue with text-rendering set to optimizeLegibility. Which in my case foundation does in the background. Setting it to auto solved it here.

Found it here: font-face on android 4.0.x doesn't work