Cloudfront: No ‘Access-Control-Allow-Origin’ header

Hello,

I just wanted to try Amazon Cloudfront on my blog and don’t get it to work.

I always get the following error:

Access to font at 'https://XXXX.cloudfront.net/wp-content/themes/mmr/vendor/fontello/font/fontello.woff2?17326630' from origin 'https://www.mydomain.co.uk' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

And I’ve tried everything I found.

This is in my .htaccess

# BEGIN CORS Headers
<FilesMatch "\.(ttf|ttc|otf|eot|woff|woff2|font.css)$">
<IfModule mod_headers.c>
    Header set Access-Control-Allow-Origin "*"
</IfModule>
</FilesMatch>
# END CORS Headers

S3 CORS configuration:

<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="https://s3.amazonaws.com/doc/2006-03-01/">
<CORSRule>
    <AllowedOrigin>*</AllowedOrigin>
    <AllowedMethod>GET</AllowedMethod>
    <AllowedMethod>HEAD</AllowedMethod>
    <AllowedMethod>DELETE</AllowedMethod>
    <AllowedMethod>PUT</AllowedMethod>
    <AllowedMethod>POST</AllowedMethod>
    <MaxAgeSeconds>3000</MaxAgeSeconds>
    <AllowedHeader>*</AllowedHeader>
</CORSRule>
</CORSConfiguration>

Cloudfront behaviors:

Cache Based on Selected Request Headers -> Whitelist
Whitelist Headers -> Origin

I also tried to add manually the following headers:
Access-Control-Request-Headers
Access-Control-Request-Method

And changed Allowed HTTP Methods -> GET, HEAD, OPTIONS

But nothing worked.

Is there something I have forgotten?

I would be grateful for any help.

Best regards!
Manuel