css font-weight, affichage différent selon le navigateur

[Wazz9]

Salut tout le monde,

Je rencontre un problème avec l'affichage d'un texte selon la valeur du font-weight.
Un font-weight: 500; dans le CSS et FF affiche le texte normalement alors que sur Chrome et Edge le texte s'affiche légèrement gras.

Est-ce qu'un membre dispose d'un Mac pour vérifier ce qu'affiche Safari avec une valeur de 500 ?

Savez vous pourquoi le rendu CSS n'est pas le même ?
Merci !

 

[Nicolas]

Malheureusement je n'ai pas de Mac pour vérifier sous Safari.
Et avec ce type de code ?

.text {
    font-weight: 500;
    -moz-font-weight: 600; /* css pour mozilla firefox */
}

 

[Jack]

FireFox utilise le moteur de rendu Gecko

Gecko - Glossaire | MDN

Gecko est le moteur de rendu développé par le Projet Mozilla et utilisé dans beaucoup d'applications/appareils, dont Firefox et Firefox OS.

developer.mozilla.org

Gecko (moteur de rendu) — Wikipédia

fr.wikipedia.org

Dans le cas présent je ne trouve pas d'infos sur cette différence d'interprétation de la propriété font-weight

 

[yule]

Pas de mac non plus, su ce fil de discussion, il existe des simulateurs (que je n'ai jamais essayé..)

 

[Wazz9]

Bon j'ai pu vérifier sur Safari et un font-weight: 500; "engraisse" un peu la police, comme Chrome ou Edge.
Donc c'est le rendu sur FF qui diffère des autres, je ne sais pas pourquoi une telle différence sur une propriété aussi simple.

Mais tout m'étonne en fait, sur CodePen ça bouge à partir de 600 mais les suivants sont de même épaisseur

Sur W3schools, 400 correspond à normal et 700 à gras (bold) donc à 500 ça devrait être un peu plus gras...

CSS font-weight property

www.w3schools.com

Voir ici :

Playit