Hello, I've encountered an issue with implementing @font-face in CSS. It seems to be working properly in Internet Explorer, but it has no effect in FireFox and Chrome. I am trying to add a custom font to my website by placing the files Snazanin.ttf and Snaznnbd.ttf in the same directory as the CSS file. Here's the code I used in the CSS:
@font-face{
font-family: MyFont;
src:url('Snazanin.ttf')format('truetype');
}
@font-face{
font-family: MyFont;
src:url('Snaznnbd.ttf')format('truetype');
font-weight: bold;
}
In another CSS file, I have the following:
#mainframe{
width:666px;
margin:0px auto 0px auto;
font-family:MyFont;
}
Additionally, there is a .htaccess file in the same directory with the content:
AddType font/ttf .ttf
While everything looks good in IE, unfortunately, Chrome and FireFox are not displaying MyFont correctly. Any help or suggestions would be greatly appreciated. Thank you!