Monday 1 February 2010

Embedded Ordered Lists (ol) corrected

I thought following was W3C valid

    <ol>
      <li>Next page</li>
        <ol >
          <li>Change colours</li>
        </ol>
      <li>Future pages</li>
        <ol>
          <li>Change layout</li>
          <li>Images</li>
          <li>Build menu header</li>
          <li>Create linkage buttons</li>
        </ol>
    </ol>

which constructs


  1. Next page
    1. Change colours
  2. Future pages
    1. Change layout
    2. Images
    3. Build menu header
    4. Create linkage buttons

But correct code, or rather code that W3C will pass in XHTML Transitional Validations is

<ol>
  <li>Next page
    <ol>
      <li>Change colours</li>
    </ol>
  </li>
  <li>Future pages
    <ol>
<li>Change layout</li>
      <li>Images</li>
      <li>Build menu header</li>
      <li>Create linkage buttons</li>
    </ol>
  </li>
</ol>

The subtle difference is that the embedded ol is included within the list item of the higher ol.