Font Face not working completely in Safari

Question

I am using the Font Face Property and I have tested it in Firefox, Chrome and Opera...it works fine. however when I try it in safari and explorer it only works on one line and not the other

here is the css :

 @font-face { 
     font-family: font2;
     src:url(../fonts/Artbrush.TTF) ;
 } 

@font-face { 
    font-family: font1;
    src :url(../fonts/playbiln.TTF) ;
}

score 24 · Answer 1 · edited Feb 26 '18 at 04:36

24

changing font-style: italic; in my @fontface declarations in the css file to (even though what was being used was an italic, oblique font) font-style: normal;... on the italic fonts mind you...

Safari now displays them fine and it doesn't seem to break other browsers for this mismatched work-around.

edited Feb 26 '18 at 04:36

sacuL

49,704
8
81
106

answered Feb 26 '18 at 01:58

brian

241
2
3

2

this fixed it for me -- typekit was producing a CSS @font-face rule for a font that used `font-style:italic` and that broke it for Safari - changing to `font-style:normal` fixed it (specifically the font was Eloquent JF Pro) – Josh KG Sep 19 '20 at 17:27
yes, as said, if you already load an Italic Font, the css style rule should be just normal – silvan Sep 29 '20 at 21:24
1

Thanks so much for this. scratching my head over for this problem – Desper Apr 01 '21 at 14:03
I can't thank you enough for posting this answer! I couldn't figure out why Safari refused to download a recursive font I added for my Angular project. – Jette Nov 23 '21 at 13:11

score 3 · Accepted Answer · edited May 23 '17 at 12:05

3

I had this problem before. what happens is that the ttf fonts do not usually work well on mac / safari

Safari and IE can't read TTF and EOT fonts

edited May 23 '17 at 12:05

Community

1
1

answered Jul 10 '14 at 18:17

Cristyan

650
4
15

Thank you very much...this helped alot..it seams that safari reads Woff fonts – Anastasiou Design Jul 10 '14 at 19:28

Font Face not working completely in Safari

2 Answers2

Linked