I am having an issue with applying a Persian font to my html content, which contains both Persian and English text. The CSS is correctly applied except for the font itself.
In the CSS, I have defined the font-face like so:
@font-face{
font-family: 'BYekan';
font-weight: normal;
font-style: normal;
src: url(../Fonts/BYekan.ttf);
}
The font is only being applied to the English text and not the Persian text. The font I am using is a standard ttf Persian font (BYekan.ttf) so there should be no issues with it.
After doing some research, it seems that many people attribute this problem to a bug in WebView on Android versions greater than 3.0, and the issue still persists on Android 4.
https://code.google.com/p/android/issues/detail?id=38536 https://groups.google.com/forum/#!topic/persian-computing/4Fm7JfiOkJk
The only solution that I've come across is to use svg fonts instead, but unfortunately, this has not worked for me either. Custom font for webview
So, how can I resolve this issue?
Note1: This question has likely been asked before, such as here:
Persian @font-face doesn't work in Chrome, Bug or not?
However, it's an older question and the suggested advice no longer seems to work (at least for me).
Note2: When I view the page in the desktop version of Chrome, the font is applied correctly.