Unicode render issue in browsers

1.2k Views Asked by At

in my page i need to render some unicode symbols from the list bellow.

  1. Latin Extended-B
  2. Greek and Coptic
  3. Cyrillic
  4. Herbrew
  5. Arabic
  6. Syriac
  7. NKo
  8. Miscellaneous mathematical symbols-A

my code is as per bellow:

body
{ 
    font-family:Arial, Tahoma, sans-serif ,Cambria Math, Symbola, Quivira, STIX, Code2000, Code2001, Code2002,Arial Unicode MS; 
}

<div>
    &#x027E1; <br />
    &#x027E2; &#x027E3; &#x027E4; &#x027E5; <br />
    &#x027E6; &#x027E7; &#x027E8; &#x027E9; &#x027EA; &#x027EB; <br />
    &#x027EC; &#x027ED; &#x027EE; &#x027EF;
</div>

but some of the symbols are not getting render properly. instead of the proper symbols box type symbols are getting render. as per bellow.

enter image description here

i've installed some new fonts (as per list bellow) and restarted the system,

Code2000(TrueType)
Code2001(TrueType)
Code2002(TrueType)
arialuni.ttf

but still the actual symbols are not getting render.

how to get full support for Unicode rendering.

3

There are 3 best solutions below

0
On

I think you are looking for the UTF, http://www.w3schools.com/tags/ref_charactersets.asp

0
On

AFAIK, all browsers support @font-face for loading webfonts and can support any character within those fonts. As such, you should be able to display any character in any browser if you make sure you provide access to a webfont with support for those characters.

To avoid using giant fonts just to support a few special characters, you can create your own fonts with tools like the Icomoon App.

I used the Icomoon App to create the Emoji emoticon font as well as for creating custom icon fonts on a per project basis.

For more info on the use or creation of icon fonts (or other webfonts), see Create webfont with Unicode Supplementary Multilingual Plane symbols

0
On

You'll need to add this into your tags

<meta charset="utf-8">