CODEWITHSUNDEEP
css
RASALGHUL
RASALGHUL

Reputation: 119

Safari wont render font-face, but in chrome

I'm setting up a typewriter page with a local font. I'm using @font-face to import it but it won't render in Safari. It renders on google Chrome.

Here is the web page https://www.dynamik.systems/typewriter/ (you have to press some keys to see some letters).


@font-face {
  font-family: "dynamik";
  src: url('http://www.dynamik.systems/wp-content/themes/fonts/DynamikGX.eot') format('opentype'),
       url('http://www.dynamik.systems/wp-content/themes/fonts/DynamikGX.ttf') format('truetype'),
       url('ttp://www.dynamik.systems/wp-content/themes/fonts/DynamikGX.woff') format('woff');
}


#content{
 font-family: "dynamik";
}

Thanks on behalf!

Upvotes: 2

Views: 196

Answers (1)

Sam Tyurenkov
Sam Tyurenkov

Reputation: 440

Looks like you have two issues:

  1. all 3 font urls should be https
  2. 3rd url is also missing starting h

There are also few additional rules you can add to font-face e.g:

  1. font-display: swap
  2. src: local properties.

Upvotes: 2

Related Questions