Astuce CSS: mettre en exposant le er dans 1er

Je partage une petite astuce pour les amateurs de belle typo...

Dans le rendu des dates, la balise [(#DATE|jour)] nous produit pour le
1er du mois un joli "1er", bien comme il faut.

Toutefois, selon la fonte et la taille utilisée pour vos dates, on
peut avoir envie d'avoir les caractères "er" mis en exposant
(superscript), càd plus petits et alignés plus haut.

Voici comment faire:

[(#DATE|jour|replace{1er, 1<sup class="sup">er</sup>})]

La balise HTML <sup> aura pour effet de positionner les caractères plus haut.

Selon la fonte, on pourra appliquer une taille réduite, voire un peu de kerning:

.sup {
font-size: 50%;
margin: 0 -0.2em;
}

Et voilà, en quelques lignes de code, un bel effet typographique que
les connaisseurs apprécieront :slight_smile:

Manuel

Le 26 novembre 2013 17:37, Manuel Schmalstieg <webdev@ms-studio.net> a écrit :

Toutefois, selon la fonte et la taille utilisée pour vos dates, on
peut avoir envie d'avoir les caractères "er" mis en exposant
(superscript), càd plus petits et alignés plus haut.

Salut, tu as aussi des plugins pour ça !

Exposants typographiques - Plugins SPIP et
Ortho-Typographie - Plugins SPIP

--
Beurt