Why can I not set Access-Control-Allow-Origin?

I am trying to include a ttf font in one of my web pages but it doesn't work and the inspect console for the web browser says:

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://domain.net/fonts/logo.ttf. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing). Status code: 200.

And I have read the documentation and tried to set a middleware for this

and added:
SecurityHeaders:
headers:
accessControlAllowOriginList: "*"

but it still complains that the Access-Control-Allow-Origin is not set.

How do I fix this? for some reason safari does not seem to complain about the missing header, but waterfox does.

Share your full Traefik static and dynamic config, and docker-compose.yml if used.