Fonts not rendering uniformly in browsers

Question

I am trying to use custom fonts on my website and in the css I have the following code:

@font-face {
    font-family: \'Sketch\';
    src: url(\'../fonts/Ske         


        

Answer 1

Different browsers supports different font formats:

So you need to create your font in all formats. You can use Font Squirrel (thank you, effectica).

And then, you can import them like that:

@font-face {
    font-family: 'Comfortaa Regular';
    src: url('Comfortaa.eot');
    src: local('Comfortaa Regular'), 
         local('Comfortaa'), 
         url('Comfortaa.ttf') format('truetype'),
         url('Comfortaa.svg#font') format('svg'); 
}

That's not the only possible way. You can find more complete information on this question at Paul Irish's blog.

And, anyway, their appearance may differ a little in different browsers.