La mesure du texte — exercice corrigé de CSS : mettre en forme le Web (école d'ingénieur) (chapitre 4)

La mesure du texte

Couleurs, unités et typographie · niveau 2

Énoncé

On limite les paragraphes à max-width: 65ch. Avec la police système en 16 pixels, Chromium donne $1 ch \approx 10, 08$ pixels.

Quelle est la largeur maximale d'un paragraphe ?
Un paragraphe de classe grand a une police de 1.25rem. Sa largeur maximale change-t-elle ? L'estimer.
Pourquoi ne pas écrire max-width: 655px ?

$65 \times 10, 08 \approx 655$ pixels. Chromium donne 655.08 pixels dans une fenêtre de 1200.
ch dépend de la police de l'élément : en 20 pixels, $1 ch$ vaut environ $1, 25 \times 10, 08 \approx 12, 6$ pixels, et la largeur maximale environ 819 pixels. Chromium donne 811,6 : la police système de macOS ajuste légèrement le dessin de ses caractères selon la taille, et le « 0 » n'est pas exactement proportionnel. La largeur s'adapte, et le nombre de caractères par ligne reste d'environ 65.
Une largeur en pixels ne suit ni la taille du texte ni le réglage du lecteur : avec un texte agrandi, la ligne contiendrait moins de caractères ; avec une autre police, la mesure changerait. La mesure est une affaire de caractères, d'où ch.