The standard css from its first version says the following:
Partial URLs are interpreted relative to the source of the style
sheet, not relative to the document.
This means that the relative routes are marked by the origin of the style page, not the document that calls them.
Knowing this, you must take into account the following observations to create the relative routes.
You can have a look at a complete article in Spanish (related to xhtml, but it also applies) in the following link: Relative and absolute links
What if it still does not work?
Resources with 404 error
Try to access from your browser by entering the absolute path of the source in the address bar:
http://midominio.com/ejemplo/carpeta/fuentes/fuente.ttf
If the resource can not be accessed, check the configuration of your server to allow access to the resource.
Resources with other errors 401, ...
We must consult the response status code if we do not know it, and configure the server to allow access to the resource.
No status code
If this small experiment launches the download of the source or resource, we should start thinking that it may be a security error. This is reflected with the status cancelado
or abortado
in the network inspectors of the main browsers.
In these cases it is common to find messages in the development console warning that we are performing an action that is not allowed, such as the consumption of resources from a different domain, known as CORS (Cross Origins)
In these cases we can consider that we are consuming a resource from another domain different from ours, and we will find that our browser is abortando
obtaining the resource.
In these cases we can consider downloading the resource and storing it in our server (¬¬, if it is our clear ...) or allowing the cross-origin in the destination server.
For that we found numerous information on the network about how to activate CORS on the main servers.