[html5] connecting ol elements

[Brian Tremblay]

It would be nice to link <ol> elements such that the numbering would be 
connected. Then you could place list items in different sections, or put 
non-list things in between them, and have the browser determine the 
correct number for each item.

My suggestion would be something like connecting form labels with form 
controls:

<section>
  <h1>foobar</h1>
  <ol id="beginning">
   <li>foo</li>
   <li>bar</li>
  </ol>
</section>

<section>
  <h1>batbaz</h1>
  <ol liststart="beginning">
   <li>bat</li>
   <li>baz</li>
  </ol>

  <aside>
   <p>
    Lorem ipsum dolor sit amet, consectetur
    adipisicing elit, sed do eiusmod tempor
    incididunt ut labore et dolore magna aliqua.
   </p>
  </aside>

</section>

<section>
  <h1>bangwhiz</h1>
  <ol liststart="beginning">
   <li>bang</li>
   <li>whiz</li>
  </ol>
</section>

which would give us

foobar
1. foo
2. bar

batbaz
3. bat
4. baz

Lorem ipsum dolor sit amet, consectetur
adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua.

bangwhiz
5. bang
6. whiz



Real world page:

http://www.tenmercer.com/recipes/prawns-app

I've used the start attribute to get the numbers right, but found myself 
renumbering them as I moved sections around. Not the end of the world, 
but it seems like this is something browsers could handle pretty easily.

-- 
Brian Tremblay