CODEWITHSUNDEEP
cssfont-face
Travis Moore
Travis Moore

Reputation: 49

Font Face Browser Compatibility Issue

Here is the code I am currently using:

@font-face {
    font-family: 'otto';
    src: url('font/otto.eot') format('embedded-opentype'), 
    url('font/otto.woff') format('woff'), 
    url('font/otto.ttf')  format('truetype'),
    url('font/otto.svg#svgFontName') format('svg');
}

Seems to work perfectly in Chrome but in just about everything else it renders a totally different font which is much larger and looks awful.

Upvotes: 1

Views: 78

Answers (1)

Travis Moore
Travis Moore

Reputation: 49

This works:

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

Upvotes: 1

Related Questions