Comment définir correctement la taille de la police
J'essaie d'obtenir un span
élément avec une hauteur exactement définie (dans cet exemple 23px
). Cependant, le navigateur ajoute quelques pixels à l'élément.
Il y a non padding
et non margin
, c'est le texte réel qui est plus gros. Comment obtenir la hauteur du texte (et avec elle aussi la span
hauteur) 23px
?
Exigences:
- Aucun essai et erreur (ou autre méthode) pour trouver un nombre arbitraire à côté de 23px pour le faire fonctionner.
- Le texte entier doit rester dans la bordure de la plage (quel que soit le texte à l'intérieur).
- La méthode doit fonctionner intuitivement, si le texte s'habille. (C'est-à-dire que la taille de l'élément sera 46px avec deux lignes, 69px avec trois lignes, etc.)
span {
font-size: 23px;
line-height: 23px;
border: red dashed 1px;
}
<span>This element is ...x28 (...x30 with border), but should be ...x23 (...x25 with border).</span>
Réponses
Réponse donnée par Alohci dans un commentaire:
Vous ne pouvez pas faire ça maintenant. Vous devrez effectuer un calcul basé sur le 23px et les métriques de police de montée et de descente. Mais actuellement, CSS n'expose pas les métriques de police pour ce calcul. Je pense qu'il est prévu d'exposer les métriques de police, même si je ne sais pas quelle forme elles prendront. Aucun navigateur ne le prend en charge, de toute façon.