Internet explorer, Safari and Chrome problems with displaying @font-face rules.
- by Antonio
Hy guys, I've a problem with IExplorer, Chrome, Safari etc.. Only Firefox works perfectly with all of this @font-face rules:
In Css:
@font-face {
font-family: Calibri;
src: url('Calibri.ttf');
}
@font-face {
font-family: HAND;
src: url('http://www.mydomain.org/css/HAND.eot');
src: url("HAND.ttf");
}
#side_text {
position:relative;
width:330px;
height:800px;
float:left;
margin-left:25px;
margin-top:30px;
}
#side_text p {
font-family: HAND;
font-size: 18pt;
text-align:left;
color:#f3eee1;
}
In .html
<div id="side_text">
text text text text text text text text
I'ven't any problem with Calibri font, maybe because it's installed on os. The HAND font it's the problem. Moreover, IExplorer don't take any customs write in css (color, font-size, align..)
That's all, hope to find a solution.. or I'll gone crazy :(
Ps: I converted the .ttf font to eot with two different online converter - Sorry for spam :/ (http://ttf2eot.sebastiankippe.com)
www.kirsle.net/wizards/ttf2eot.cgi
because I've problem to execute ttf2eot on google code
Thanks a lot guys!!