Hier, dans mon billet sur des tests dans deerpark alpha2, j'écrivais que les compteurs CSS étaient buggés. En fait, c'est moi qui avait mal fait ma feuille de style et donc mon test était faux.

Pour rappel, counter-increment permet d'incrémenter un compteur, et counter-reset permet de remettre à zéro un compteur. En fait, c'est une mauvaise interprétation de ma part. Ce n'est pas à proprement parlé d'une remise à zéro. Selon la spécification, il s'agit de la création d'une nouvelle instance d'un compteur. Ce compteur est visible au niveau des balises indiquées par le sélecteur, et de leurs balises filles, mais pas dans le reste du document. Ainsi dans l'exemple :

h2:before { 
   content: counter(chapter) ".";
   counter-increment: chapter;
}
h2 {    counter-reset: section; }
h3:before { 
   content: counter(chapter) "." counter(section) ".";
   counter-increment: section;
}

Je n'ai pas indiqué de counter-reset pour le compteur chapter. Du coup il est crée implicitement à chaque fois que j'y fais appel, donc dans chaque H2. Du coup la numérotation de mes H2 ne se fait pas, et j'ai toujours 1. Pour régler ce problème, il a fallu que je fasse un reset du compteur sur la balise mère de mes h2, qui est dans mon exemple body :

 body { counter-reset: chapter; }

Ainsi le compteur chapter est crée au niveau de la balise body. Il est donc disponible dans les balises filles, et sera donc incrémenté à chaque fois qu'un counter-increment sera indiqué dans les styles des balises filles. Mon exemple s'affiche alors parfaitement dans DeerPark. À noter aussi qu'apparement le reset ne peut être fait dans un selecteur :before, :after etc..

On pourra conclure par :

  1. l'exemple donnée dans les specs du w3c est faux, il manque le reset du compteur chapter
  2. Opera 8 est buggé puisque dans ce navigateur, on n'a pas besoin de faire un reset du compteur chapter alors que c'est contraire à la spec.