[whatwg] Fwd: Nested lists

[Tab Atkins Jr.]

Blarg forward to list.

---------- Forwarded message ----------
From: Tab Atkins Jr. <jackalmage at gmail.com>
Date: Tue, Aug 5, 2008 at 9:15 AM
Subject: Re: [whatwg] Nested lists
To: noclip <noclip at gmail.com>




On Mon, Aug 4, 2008 at 8:15 PM, noclip <noclip at gmail.com> wrote:

> Are there plans to natively support nested unordered lists in HTML 5? I'm
> referring here to something like this:
>
> Top level list item
> |-- Childless second level list item
> |-- Another childless second level list
> [+]- Collapsed second level list item with children
> [-]- Expanded second level list item with children
> |    |-- Third level list item
> |    |-- Another third level list item
> |   [+]- Collapsed third level list item with children
> |   [-]- Expanded third level list item with children
> |    |    |-- Fourth level list item
> |    |    |__ Another fourth level list item
> |    |__ A final third level list item
> [+]- Another collapsed second level list item
> |__ A final second level list item
>
> This is already possible through CSS, but these kinds of nested lists are
> more organizational than presentational and could benefit from native
> support with their own kind of unordered list element. The markup for the
> above list could be something like this:
>
> <nl>
>  <li id="foo">Top level list item</li>
>  <lg parent="foo">
>    <li>Childless second level list item</li>
>    <li>Another childless second level list item</li>
>    <li id="bar">Collapsed second level list item with children</li>
>    <lg parent="bar">
>       <!-- Child list items here -->
>    </lg>
>    <li id="three">Expanded second level list item with children</li>
>    <lg parent="three">
>       <li>Third level list item</li>
>       <li>Another third level list item</li>
>       <li id="four">Collapsed third level list item</li>
>       <lg parent="bar">
>          <!-- Child list items here -->
>       </lg>
>       <li id="five">Expanded third level list item with children</li>
>       <lg parent="bar">
>          <li>Fourth level list item</li>
>          <li>Another fourth level list item</li>
>       </lg>
>       <li>A final third level list item</li>
>    </lg>
>    <li id="boo">Another collapsed second level list item</li>
>    <lg parent="boo">
>       <!-- Child list items here -->
>    </lg>
>    <li>A final second level list item</li>
>  </lg>
> </nl>
>
> Or you could define the list groups separately, at the beginning or end of
> the <nl>.


Could you be more specific about how this is better than just nesting
<ul>s?  Your example can be organized just as well with:
 <ul>
    <li>Foo</li>
    <li>
        <ul>
            <li>Bar</li>
            <li>Baz</li>
...

This markup has the added advantage that it'll display a nested list no
matter what - it is it's own fallback content if the UA doesn't have
appropriate CSS support.  Plus it automatically nests appropriately, without
the need to specify parents explicitly.  As shown in your example, that's
somewhat error-prone ( below <li id="five"> you have <lg parent="bar">,
which should obviously be <lg parent="five">).  ^_^
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.whatwg.org/pipermail/whatwg-whatwg.org/attachments/20080805/6a2ce1b7/attachment.htm>