yakov thin fonts incorrect display

Question

I have embedded Yakov thin fonts with CSS via @font-face but the fonts are are so different from the original ones. What could be the reason for this? Here is my code

@font-face 
{
    font-family:'Yakovthin';
    src: url('../fonts/yakovthin-webfont.eot');
    src: url('../fonts/yakovthin-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/yakovthin-webfont.woff') format('woff'),
         url('../fonts/yakovthin-webfont.ttf') format('truetype'),
         url('../fonts/yakovthin-webfont.svg#') format('svg');
}

div#mainContainer
{
   font-family:'Yakovthin';
   font-size:12px;
}

Could anyone please help?

score 0 · Answer 1 · answered Apr 25 '12 at 20:35

Can you provide a URL? Also, try adding font-weight: normal to your code:

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

div#mainContainer
{
   font-family:'Yakovthin';
   font-size:12px;
   font-weight: normal;
}

I did, but it still doesn't work. You can find it here profsyntax.com/demo/Heshbonia . — Karine, Apr 25 '12 at 20:43

score 0 · Answer 2 · answered Apr 27 '12 at 18:26

0

You should try this instead :

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

I'm pretty sure you can drop the .eot format, as when .ttf isn't supported, .woff is, so it should do the trick. You should also learn about the "unicode-range" option if you want to deal with Hebrew.

answered Apr 27 '12 at 18:26

Frederic

34
1

IE9 supports only .eot. Thanks though. – Karine Apr 27 '12 at 20:24
Actually, no, IE9 also supports .woff format. Did the code I gave you work ? – Frederic Apr 28 '12 at 15:00
That's weird cause I read this in w3schools.com "However, Internet Explorer 9 only supports .eot type fonts, while Firefox, Chrome, Safari, and Opera support .ttf and .otf type fonts (http://www.w3schools.com/cssref/css3_pr_font-face_rule.asp?output=print)". Unfortunately it didn't work, but thank for the help anyways. – Karine Apr 28 '12 at 18:20

score 0 · Accepted Answer · answered Apr 30 '12 at 20:15

0

I have solved the issue. The problem was that the site the fonts were not generalized properly.

answered Apr 30 '12 at 20:15

Karine

587
1
11
24

yakov thin fonts incorrect display

3 Answers3