Custom Fonts not working on webkit browsers

Question

can someone help me with this problem: I have this font:

@font-face {
    font-family: 'Museo500Regular';
    src: url('MuseoSans_500-webfont.eot');
    src: local('?'), 
    url('MuseoSans_500-webfont.woff') format('woff'), 
    url('MuseoSans_500-webfont.ttf') format('truetype'), 
    url('MuseoSans_500-webfont.svg#webfontr3rD8cn7') format('svg');
    font-weight: normal;
    font-style: normal;
}

that is not working on webkit browser and I don't understand why... O other browsers like, firefox or IE it works just fine but only on webkit is not rendering well.

here you have an example on a test page with a drop down menu, just look at the font on other browsers and google chrome for example.

http://mainpage.ueuo.com/

Thank's.

Looks about the same in Chrome as Firefox to me. Keep in mind Chrome has crap font rendering, always has. But from my views I doubt anyone is really going to notice the difference here. The tracking is a little wider in Chrome and the letters look crisper but beyond that I don't see a difference. — Rick Calder, Oct 25 '12 at 11:02
this was copied from an old project, I know is deprecated :) — RulerNature, Oct 25 '12 at 11:34
@RulerNature, please don’t write “doesn’t work”, especially when it actually works, just not the way you’d prefer. Also please explain what we should see when we compare renderings. It’s probable that the difference, if there is one, cannot be changed, but there’s a small chance that it is, in part, of such typographic nature that it can be affected in CSS. — Jukka K. Korpela, Oct 25 '12 at 14:33

score 1 · Answer 1 · answered Oct 25 '12 at 11:51

I have downloaded your MuseoSans_500-webfont.ttf.. looks like its not a valid font... or not uploaded properly on the server... Do upload it again...

Or go to the following link and generate ur font-face css... http://www.fontsquirrel.com/fontface/generator

@font-face {
    font-family: 'Museo500Regular';
    src: url('museosans_500-webfont-webfont.eot');
    src: url('museosans_500-webfont-webfont.eot?#iefix') format('embedded-opentype'),
         url('museosans_500-webfont-webfont.woff') format('woff'),
         url('museosans_500-webfont-webfont.ttf') format('truetype'),
         url('museosans_500-webfont-webfont.svg#_.regular') format('svg');
    font-weight: normal;
    font-style: normal;

}

I had the same impression but I already tried to generate font-face kit with fontsquirrel but render the same in chrome :| — RulerNature, Oct 25 '12 at 12:22

score 0 · Answer 2 · answered Oct 25 '12 at 11:10

0

Your CSS definition for @font-face has a wild } on line 11 (see default.css). This is likely causing you some problems.

Also, please, please, please don't use a table for your layout!

answered Oct 25 '12 at 11:10

BenM

52,573
26
113
168

nope is not from that "}". The example was copied from an old project just to see you how is rendering, in my real project I don't have a table for layout and I don't have that "}". – RulerNature Oct 25 '12 at 11:33

score 0 · Answer 3 · answered Oct 25 '12 at 15:53

0

Remove single quotes in font name, do not need for single font, it needs only multiple fonts

font-family: Museo500Regular;

answered Oct 25 '12 at 15:53

Web Designer cum Promoter

1,334
14
26

Custom Fonts not working on webkit browsers

3 Answers3