Let's view the following example in Firefox 61.0.1 on Ubuntu 18.04 with Charis SIL 5.000 installed:
<html lang="sr">
<head><meta charset="utf-8"></head>
<body style="font-family: 'Charis SIL'; font-style: italic">
кућа ми је отворена, моја ватра угашена<br>
зато, ако желиш, боже кише, само напред, пошаљи пљусак
</body>
</html>
It displays Russian versions of т, г, б and п instead of Serbian versions.
If I remove the font-family property or change it to some other value, like 'Ubuntu' or 'Noto Serif' or 'Caladea', Serbian versions are displayed correctly. If I view the same snippet unchanged in Chrome or Opera, they also display Serbian versions correctly. However, the combination of Firefox and Charis SIL somehow doesn't work. Why?
Here is a similar example using .woff so you don't have to install the font.
Here is a screenshot of how it should be (with Serbian cursive, taken in Chrome):
And here is what it looks like in Firefox (with Russian cursive):
Related
I have developed a site in Polish using the 'Lato' Google Font (supports the latin-extended character subset). My site is http://www.innova.uno
I have placed the code from GF website in my theme's ` section:
<link href="https://fonts.googleapis.com/css?family=Lato:100,100i,300,300i,400,400i,700,700i,900,900i&subset=latin-ext" rel="stylesheet">
When I open the site in Chrome, all text are displayed correctly. But when opening the site in Firefox the Polish characters are changed to Times New Roman - but only in the Lato font based texts - headers (see screenshot: http://pl.tinypic.com/r/etrsxj/9) - other latin-ext fonts work well.
I don't know if any of you will see the site in FF the same way, but if anybody does and could have a slight idea why is this happening - please give me a hint! :)
Thx.
This has been asked before, but I can't figure out what's wrong. I'm printing pdfs using phantomjs .render().
The rendered page is basically a local static site with these properties:
<meta charset="UTF-8">
font: normal 17px helvetica,arial,verdana,sans-serif
running and tested on Windows locally and Azure Worker Roles
Chinese language pack installed and working when printing the same page from Chrome (Installed fonts e.g. Arial Unicode MS, SimSun ...)
Latin characters are all fine, just Chinese ones are displayed as "?"
For example
I also tried the entire page in Arial or SimSun only, but no difference.
Any idea how to get this working on Windows?
Thanks!
You need a chinese font. None of them is in a chinese font family.
font: normal 17px helvetica,arial,verdana,sans-serif
Here are some font has chinese char.
宋体：SimSun; 黑体：SimHei; 新宋体：NSimSun; 微软雅黑：Microsoft YaHei; 新細明體：PMingLiU
This is much more than a guide.Chinese Standard Web Fonts: A Guide to CSS Font Family Declarations for Web Design in Simplified Chinese
This has Traditional Chinese fonts.Chinese web fonts
Google's font. Sorry for not being a link, there is a limit for me.
noto-sans-hans
Adobe's typekit
source-han-sans
Test Html file:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>你好中文！</title>
<style type="text/css">
p.serif{font-family:"Times New Roman",Georgia,Serif}
p.sansserif{font-family:SimSun}
p.s1{font-family: 黑体}
p.s2{font-family: KaiTi}
p.s3{font-family: Microsoft YaHei}
</style>
</head>
<body>
<div>
<p class="serif">你好中文！111</p>
<p class="sansserif">宋体</p>
</div>
<div>
<p class="s1">黑体</p>
<p class="s2">楷体</p>
<p class="s3">微软雅黑</p>
</div>
</body>
</html>
Result
Lastest to do, try to change your location to china. I don't expect this working, as I tried the phantomjs in win10 ENG preview, working very well. Control Panel > Region > Administrative > Language for non-Unicode programs
I've tested it here, http://www.fileformat.info/info/unicode/utf8test.htm
No talking about the miscellaneous ones.
Is it Windows 7 fonts? Is it Chrome rendering? Is it some configuration I should tweak?
Any help is welcome.
EDIT: I've just checked that UTF-8 was selected in Chrome codification, and it was.
Strangly I can see more symbols in IE 11 (!)
EDIT 2: Comparision -> http://bit.ly/font-rendering-chrome-ie
(I guess I should have posted this on the superuser forum, but I can't move it myself.)
Most browsers use a fallback font if some Unicode characters aren't available in a font. It seems that the implementation of that fallback mechanism differs in IE and Chrome.
One possible solution is to use a different font-family for Unicode characters. For Windows systems, I typically use Lucida Sans Unicode with a CSS rule like this:
.unicode {
font-family: "Lucida Sans Unicode", sans-serif;
}
I use Unsemantic for the first time, and I forgot to check my page on IE8. Here is the disaster : http://canapin.com/web/meteo/
Unsemantic is supposed to be IE8 compatible, but my page is messed up, and I can't figure out why.
Any idea? :(
As stated in its issue tracker, since IE8 doesn't support media queries, Unsemantic grid offers a fixed-width layout for it, through a separate css file inclusion:
<!--[if (lt IE 9) & (!IEMobile)]>
<link rel="stylesheet" href="./stylesheets/ie.css?1389034275" />
<![endif]-->
Note the conditional comment avoiding the separate css for mobile versions of IE (they are supposed to support media queries):
I suppose you can download the source of the separate css from here:
http://unsemantic.com/stylesheets/ie.css
So, if you accept to have an IE8 with fixed-width layout (and it seems very reasonable to me), you don't need a javascript fix ;)
Bye bye!
for IE8 and lower you have to include a shim, which comes with the Unsemantic files.
Include the following code in your head and you should be fine:
<!--[if lt IE 9]>
<script src="./assets/javascripts/html5.js"></script>
<![endif]-->
So, just point to the html5.js file and this should fix it. Let me know whether this worked for you.
Cheers, Marvin
I am facing font-face issue
I am using gotham font check below code:
#font-face{
font-family: Gotham MEDIUMITA;
src: url('Gotham_Font/GOTHAM-MEDIUMITA.OTF')format("truetype");
}
Its working in IE8,firefox,chrome. But in IE9 font is not applying...
is there any solution pls help regarding this....
Thanks
Ravi
First of all, using this font in a web page violates your font license from H&FJ. Secondly, there are a couple of reasons that it might not be working:
IE9 requires that any raw TTF linked with #font-face have the OS/2 fsType code embedded in the font be set to 'Installable'. Likely your font does not have this set correctly. You can fix this by using a WOFF or EOT instead. See the correct syntax for a font-face declaration here: http://www.fontspring.com/blog/the-new-bulletproof-font-face-syntax/
Your font-family name should ideally be "in_quotes_with_no_spaces"