Font renders in Safari/Chrome but not Firefox
So, I'm trying to use a TTF. Safari renders it perfectly, but Firefox does
not render it AT ALL; it goes to the default serif font instead of the
Helvetica alternative. I've tried an online font converter and tried
converting to OTF to no avail, then BACK to TTF but with the same failed
results. I checked permissions, all match the other fonts I have that
render with no problems. Firebug revealed no errors.
Here's my CSS to define the font parameters:
@font-face {
font-family: 'hcb';
src: url('/fonts/Helvetica-Condensed-Black-Se.ttf');
font-style: normal;
font-weight: normal;
}
Again, this renders perfectly in Safari, so I know I have the URL right. I
even tried replacing that with:
src: url('http://www.my.url.com/fonts/Helvetica-Condensed-Black-Se.ttf');
Same deal: worked perfectly in Safari, not at all in FF.
As for the rest of my CSS:
#alert_bar {
position: relative;
display: block;
width: 400px;
height: 55px;
line-height: 55px;
background-color: black;
color: white;
font-family: 'hcb';
font-size: 24px;
font-weight: bold;
text-align: center;
z-index: 1000;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
}
So why is the font not rendering???
No comments:
Post a Comment