CODEWITHSUNDEEP
htmlcssgoogle-chromecharacter-encoding
DJack
DJack

Reputation: 639

Google Chrome wrong character - bug?

I did this simple HTML to show you what is bothering me..

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<html>

    <style>
        @font-face {
            font-family: "ubuntu-light";
            src: url(Font/ubuntu/Ubuntu-L.ttf) format("truetype");
        }

        h1 {
            font-family: "ubuntu-light";
        }
    </style>

    <body>
        <h1>Ubuntu font test</h1>
        <h1>Š š Ž ž Č č</h1>
    </body>
</html>

You can get the font here: http://font.ubuntu.com

So the point is that if I open the Page in Safari or Firefox, the page opens correctly, BUT if I open it in Chrome, the letters Š and š are not displayed correctly.

I tried to put this in my style but is not working:

body {
    -webkit-animation-duration: 0.5s;
    -webkit-animation-name: fontfix;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: linear;
    -webkit-animation-delay: 0.5s;
}

@-webkit-keyframes fontfix {
from {opacity: 1;}
to {opacity: 1;}
}

I also tried to create a CSS file with this style and then call it at the en of the page with JS but it is not working.

I have "AddDefaultCharset utf-8" in Apache. In Google Chrome I set the encoding to Central Europe and also to UTF-8 but nothing..

Upvotes: 1

Views: 1614

Answers (1)

mach
mach

Reputation: 195

This is indeed a bug, see its description on launchpad: Bug #1334363 “Wrong characters appear in some Mac apps ([‘] → [⁸], [’] → [⁹], [–] → [ẃ], [—] → [Ẅ])” : Bugs : Ubuntu Font Family

The reason seems to be a broken Unicode cmap subtable.

You can circumvent this bug if you use a stripped-down version of Ubuntu, for instance a subsetted version served by Google Fonts, for instance with the following style :

@import url(http://fonts.googleapis.com/css?family=Ubuntu:300&subset=latin);

However, on a computer where the Ubuntu fonts are installed, the characters will still look wrong.

If you want to fix the display on your own computer and if you do not need the complete Ubuntu fonts, you can grab the stripped-down versions from Google Fonts. To do this, visit the following Google Fonts stylesheet in Safari, copy the links to the TTF files and download them (in other browsers, the Google Fonts stylesheet will be generated with WOFF fonts that you cannot install on Mac OS X):

http://fonts.googleapis.com/css?family=Ubuntu:300,400,500,700,300italic,400italic,500italic,700italic|Ubuntu+Condensed&subset=latin,latin-ext

Upvotes: 2

Related Questions