Comment puis-je faire la boîte de contenu d'un élément adapter à la taille de la police de son contenu

Question

Si vous regardez cette codepen https://codepen.io/anon/pen/pwQrmm

`h2 { 
    padding-top:16px; 
    padding-bottom:16px; 
    font-size: 16px; 
}` 

la balise h2 est définie avoir 16px en taille de la police, mais la hauteur de sa boîte de contenu est 18px. Est-il possible de définir la hauteur de la zone de contenu pour correspondre à la taille de police sans définir manuellement sa hauteur avec la hauteur: 16px. Aussi, lorsque la balise h2 devient deux lignes, la boîte de contenu devrait devenir 32px.

J'ai essayé de chercher ce problème mais je n'ai trouvé aucune réponse. Je suis désolé si cela a déjà été répondu.

Answer 1

Vous pouvez définir la hauteur de ligne pour qu'elle corresponde à la taille de la police. Si vous écrivez suffisamment de contenu (il y aura donc une deuxième ligne), il deviendra 32px.

Cependant, cela n'est pas suggéré. Le contenu deviendra trop encombré, le texte sera trop proche du texte ci-dessus (et ci-dessous). La hauteur de ligne doit être comprise entre 1,2x et 1,5x de la taille du texte.