CODEWITHSUNDEEP
htmlfonts
Thuglife
Thuglife

Reputation: 161

Symbols not displayed properly in custom fonts

I downloaded the Webfont Kit (for Quicksand font) from font squirrel website; and I am trying to display the word Erdös using the new font; using the HTML entry ö however, does not seem to work.

Looking at the list of glyphs for that font (Quicksand); I can see that they have the letter o (both capital letter and small letter) with two dots on top of it.

Here is what I'm getting:

enter image description here

As shown in the above picture, the other letters are displayed correctly (using the correct font); but not the o with two dots!

Here is my HTML code:

<h1 id="erdos">Erd&ouml;s</h1>

Where I specify erdos in my css file to use that font!

Edit: I'm posting additional information/code about the question:

I downloaded the Webfont Kit from the Webfont Kit tab from the same page.

CSS:

@font-face {
    font-family: 'QuicksandLight';
    src: url('fonts/Quicksand/Quicksand_Light-webfont.eot');
    src: url('fonts/Quicksand/Quicksand_Light-webfont.eot?#iefix') format('embedded-opentype'),
    url('fonts/Quicksand/Quicksand_Light-webfont.woff') format('woff'),
    url('fonts/Quicksand/Quicksand_Light-webfont.ttf') format('truetype'),
    url('fonts/Quicksand/Quicksand_Light-webfont.svg#QuicksandLight') format('svg');
    font-weight: normal;
    font-style: normal;
}

h1#erdos {
    margin-top: 0;
    margin-bottom: 0;
    font-family: quicksandlight;
}

I tested the output in both Chrome 27.0 and Firefox 21.0

The output of Chrome is:

enter image description here

The output of Firefox is:

enter image description here

Upvotes: 2

Views: 1378

Answers (1)

Jukka K. Korpela
Jukka K. Korpela

Reputation: 201538

On the Webfont Kit page at FontSquirrel, you need to select “Don’t Subset” in the dropdown “Choose a Subset:”. The default there is “English”, which apparently means that only Ascii letters are included.

Upvotes: 1

Related Questions