W3C home > Mailing lists > Public > www-style@w3.org > September 2006

Re: [CSS21] Possible counters() limitation?

From: Werner Donné <werner.donne@re.be>
Date: Mon, 11 Sep 2006 12:22:10 +0200
Message-ID: <450538D2.60807@re.be>
To: www-style@w3.org

I've looked through those examples again and the only
one for which it doesn't work out of the box is the following:

<section>
  <h>should be 1</h>
  <div>
    <section>
      <h>should be 1.1</h>
    </section>
  </div>
  <section>
    <h>should be 1.2</h>
  </section>
</section>

The variant of my solution for this example is:

section, div, h { display: block; }
section:before { counter-increment: item; }
section > *:first-child:after { counter-reset: item; }
h:before { content: counters(item, '.'); }

The idea behind it is the same, however. You use nested counters.
When such a counter is reset in a nested element this creates a
"fresh" counter. You can't simply reset it on the section element
in this case, because then the counter would be reset for each
occurrence of section. At each level it should only be reset for
the first occurrence. However, because of the fact that the
section elements are not always siblings (whatever that would
mean) and because of the selector syntax, we don't know which is
the first nested section element.

The point in my example is that you don't have to. The first
child element in the nested scope will do fine for resetting the
counter. In this particular case we want it after the counter
of the parent level has been "consumed", which is why the ":after"
pseudo element is needed. A more explicit alternative could be:

section > h:first-child + * { counter-reset: item; }
-- 
Werner Donné  --  Re
Engelbeekstraat 8
B-3300 Tienen
tel: (+32) 486 425803	e-mail: werner.donne@re.be
Received on Monday, 11 September 2006 10:22:09 GMT

This archive was generated by hypermail 2.2.0+W3C-0.50 : Monday, 27 April 2009 13:54:46 GMT