Font files were working in local environment but live site I'm getting 404 (Not Found)-CodePudding

I'm using some fonts in WordPress and I'm importing them like this

@font-face {
   font-family: "Neutra";
   src: url("/wp-content/themes/Sunterra/resources/fonts/Neutra-Text-Bold.otf");
}

This worked in my local dev environment but on the live server I'm getting 404 (Not Found)

CodePudding user response：

The live server is not finding the font because of most likely a pathing or permission issue.

Try to use the full url to test. If that doesn't work, you should try to find out where the font is actually located and if it even exists on the live server.

CodePudding user response：

@font-face {
   font-family: "Neutra";
   src: url("/wp-content/themes/Sunterra/resources/fonts/Neutra-Text-Bold.otf");
}

I think your font path was wrong. make sure your css file was link correctly something like that 

@font-face {
  font-family: 'iconfont';
  src:
    url('../fonts/iconfont.ttf?ukrc8w') format('truetype'),
    url('../fonts/iconfont.woff?ukrc8w') format('woff'),
    url('../fonts/iconfont.svg?ukrc8w#iconfont') format('svg');
  font-weight: normal;
  font-style: normal;
}

font file need to link with your css file

File stracture 
-root
  -css
    -fonts.css
  -fonts
    -iconfont.ttf