Font-size avec des pixels "décimal"

Bonsoir,
Jusqu'à maintenant j'utilisais des font-size avec des rems ( équivalent à des pixels entiers).
Par exemple 1.0625 rem soit 17px.
Et ce parce que j'étais resté sur l'idée que les navigateurs ne comprenaient pas , par exemple, une taille de 17,6px ( soit 1.1rem).
Pourtant en utilisant l'extension FontFinder (Chrome et Firefox), on peut voir des font-size de 18,4px ou des padding de 3,2px.
je souhaiterai donc avoir des avis sur ce qu'il en est précisement.
Merci.
Modifié par cpalo (16 Jul 2023 - 21:07)

Justement c'est bien ça qui m'a "troublé" car j'étais resté l'idée qu'on ne pouvait pas indiquer

<p style="font-size: 24.6px;">font-size:24.6px</p>

car les pixels devaient être obligatoirement des nombres entiers.
Modifié par cpalo (18 Jul 2023 - 23:38)

Salut,

Pour les fonts je ne sais pas trop les impacts que cela à, mais on peut introduire du % de pixel en width/height via des enfants définit en % du parent, et ça provoque parfois des comportement bizarre sur certains navigateurs : a priori calculé au pixel près sauf que certains navigateur tronque et d'autres font un arrondi (et quand c'est un arrondi supérieur, ça rajoute des pixels et bousille l'affichage)

Bref de manière global pour les décimales de pixel, j'aurai tendance à dire "à éviter" pour être sur un comportement sûr (même si c'est rarement grave au final)
Modifié par Mathieuu (20 Jul 2023 - 12:03)

Bonjour,

oui tu peux déclarer la taille que tu veux mais ça fera rarement une différence...
Avec l'antialiasing, le retina/dpi, tu verras peut-être un pixel bouger sur un jambage.

Tu peux laisser le navigateur faire le calcul lui-même, exemple chez Florens Verschelde : https://fvsch.com/css-locks#toc-2-c (c'est dans une MQ et il y a 2 autres déclarations)

font-size: calc( 3.125vw + 10px );

ou pour le fun https://css-tricks.com/snippets/css/fluid-typography/

Tu devrais pouvoir zoomer à 200% dans les 2 modes de zoom (celui devenu standard et le zoom texte de Firefox) sans que ça n'explose ton contenu, ça devrait rester lisible (tu passes en résolution mobile donc sur 1 colonne par exemple mais le texte n'est pas superposé à autre chose, pas coupé par le bord de l'écran, etc) donc 0.5px de plus ou de moins, à part faire passer un texte sur 8 lignes au lieu de 7 ça ne devrait pas avoir de conséquences fâcheuses.

Merci à tous vos retours.
Je vais donc conserver mon choix initial, à savoir des font-size en en rem ( sans me préoccupper de leur conversion en pixels "decimaux")
Au lieu de 1.1875 rem ( 19px)
Je vais revenir à 1.2rem (19,2px)