2

I want Calibri as my default font on my website, however, Safari is not displaying Calibri at all - even though I have it set in CSS. Safari is displaying Times New Roman.

I have the font-face CSS set, and it is working in IE, and Chrome. Here is what I have in my CSS:

@font-face{
  font-family: Calibri, Candara, Segoe, "Segoe UI", Optima, Arial, sans-serif;
  src: url('https://pathtofile/calibri.ttf')  format('truetype');
  font-weight: normal;
  font-style: normal;
}

I have also looked this up, and it looks like I may need a different file-type. If that is true, I'm not able to convert it as every converting software I've tried online states that Calibri is blocked and cannot be converted. Other answers seem a bit outdated for older versions of Safari, as well.

Any help is appreciated.

ValleyDigital
  • 1,460
  • 4
  • 21
  • 37
  • have you tried fontsquirrel's webfont generator? that's what I use for stuff like this. – Michael Coker May 01 '17 at 16:55
  • @MichaelCoker - I did try that, but I get an alert stating that particular font cannot be converted due to Microsoft requesting it be blocked. – ValleyDigital May 01 '17 at 16:57
  • Have you looked at this SO post?: http://stackoverflow.com/questions/14889045/safari-and-ie-cant-read-ttf-and-eot-fonts – Paurian May 01 '17 at 16:58
  • Also - is the @font-face rule the first item in the stylesheet? It should exist prior to any style rule. – Paurian May 01 '17 at 17:00
  • Maybe this isn't the solution you're looking for, but I would always use http://fonts.google.com as it will also use other font formats for full compatibility automatically. I know they don't have Calibri but there are so many fonts you can probably find one really similar. – Zak May 01 '17 at 17:11
  • Also, I believe line 2 should just read `font-family: Calibri`. – Zak May 01 '17 at 17:12
  • What's the version of Safari you use? – Stickers May 01 '17 at 18:10

0 Answers0