EM Calculator : simplifiez vos calculs en em

Une pratique courante pour déterminer les tailles de caractère consiste à utiliser une valeur de 62.5% sur le body pour obtenir une taille de base de 10px et d’utiliser un coefficient multiplicateurs en em pour simplifier les calculs à venir. Dans ce contexte, 1.2em est égale à 12px et 2.4em à 24px, etc. Selon l’article Font sizing with rem could be avoided, c’est une fausse bonne idée : des calculs fastidieux nous sont épargnés, certes, mais nous devrons spécifier les nouvelles tailles à chaque fois. On ne peut raisonnablement pas utiliser une taille par défaut de 10px pour le texte si on veut être lu.

EM Calculator

Si vous voulez utiliser une taille par défaut de 14px pour le texte, il vaut mieux appliquer une taille de 0.875em sur le body et sortir la calculette pour les autres tailles. Si vous avez la flemme d’utiliser votre calculatrice, EM Calculator est fait pour vous.

EM Calculator est un outil créé en JavaScript par Piotr Petrus pour convertir des px en em pour simplifier l’usage des em.
EM Calculator est un service simple et efficace pour déterminer l'équivalent em d'une taille exprimée en px.

Une des pierres d’achoppement des em's est qu’il faut remettre un coup de font-size: 1em; lorsque les balises sont imbriquées. Pour pallier cet inconvénient, EM Calculator permet de choisir sur quels niveaux de profondeur le calcul doit s’effectuer. Bien sûr, certains diront que l’unité rem est faite pour cela, mais l’utilisation de EM Calculator n’est tout de même pas si rédhibitoire.

Les plus

Comme vous pouvez le constater sur l’illustration ci-dessus, il est possible de choisir entre un élément frère (sibling) ou enfant (child). Parmi les options, nous pouvons modifier la taille par défaut de l’agent utilisateur (en général 16px). Cerise sur le gâteau, on peut sauvegarder plusieurs sessions de travail.

Le moins

Il ne semble pas possible d’exporter les CSS.