32
Views
3
Comments
Solved
Font not working in Safari
Question
Application Type
Reactive

Hi there,

With my application the font is showing different on Safari than it should. It is working fine in Service Studio and on Google Chrome, but not on Safari.

At the moment I'm using an import, but I also tried a @font-face without any luck.

Does anyone know what the issue could be?





Scherm­afbeelding 2024-01-10 om 17.44.51.png
Scherm­afbeelding 2024-01-10 om 17.44.16.png
Scherm­afbeelding 2024-01-10 om 17.44.35.png
Scherm­afbeelding 2024-01-10 om 17.44.11.png
2023-12-16 19-57-03
Sanjay Kushwah
Solution

hi @Eric van Heesen,

I checked sans-serif font-family

It is not compatible with some of Safari versions, see unsupported safari versions in Red 

https://caniuse.com/?search=sans-serif

Additional:

 Safari has limited support for certain font formats like WOFF2. Ensure the font you're using is in a compatible format like TTF, OTF, WOFF, or SVG.

Provide multiple font formats within your @font-face declaration to increase compatibility across browsers:


@font-face {

  font-family: 'MyFont';

  src: url('myfont.woff2') format('woff2'),

       url('myfont.ttf') format('truetype'); 

}



Thanks,

Sanjay Kushwah

UserImage.jpg
Eric van Heesen

Thank you Sanjay,

I managed to show the fonts with adding them as a resource (both woff2 and ttf).

2022-10-08 04-50-27
kavita bagale

Hello Eric van Heesen,


You can try with TTF type. It will supports. 


Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.