J’aime beau­coup la mise en forme « façon éti­quette » uti­li­sée dans les recom­men­da­tions W3C. Notez, si vous allez sur le site du W3C (exemple), que sur tous les navi­ga­teurs à...

J’aime beau­coup la mise en forme « façon éti­quette » uti­li­sée dans les recom­men­da­tions W3C.

Notez, si vous allez sur le site du W3C (exemple), que sur tous les navi­ga­teurs à l’exception d’Opera, vous ne ver­rez pas les chiffres en carac­tères romain, pour la simple et bonne rai­son que les autres navi­ga­teurs n’ont pas jugé utile de gérer counter-increment.

L’« éti­quette » est en fait un contenu auto­gé­néré avec des retraits néga­tifs.

Voici le code :

.epigraph:before { 	content:"Example " counter(exampleno,upper-roman); 	counter-increment:exampleno; 	left:-2.5em; 	position:absolute; 	top:-0.6em }

Et dans un fichier séparé (parce que je n’arrive tou­jours à embar­quer des CSS, j’ignore pour­quoi), voici deux implé­men­ta­tions, d’abord mini­male et ensuite tel que chez le W3C (modulo quelques modi­fi­ca­tions mineures). Atten­tion, vous pour­riez bien ne rien voir. Ma ver­sion allé­gée fonc­tionne sur Opera 9.0.1, mais pas sur Safari 2.0.4. Fire­fox me donne encore des résul­tats dif­fé­rents et je ne sais pas lequel à rai­son, pour le coup. J’ai séparé le code que je consi­dère mini­mal des enri­chis­se­ments W3C, ceci grâce à la méthode des classes mul­tiples.

Page de visualisation