W3C home > Mailing lists > Public > www-style@w3.org > March 2010

Re: [css3-lists] Proposal: list item marker from the content of the li element

From: Tab Atkins Jr. <jackalmage@gmail.com>
Date: Tue, 30 Mar 2010 14:17:29 -0700
Message-ID: <dd0fbad1003301417r73c4031dq1bc47aabb28765ae@mail.gmail.com>
To: Markus Ernst <derernst@gmx.ch>
Cc: www-style@w3.org
On Tue, Mar 30, 2010 at 1:40 PM, Markus Ernst <derernst@gmx.ch> wrote:
> In January there was a discussion in the WHATWG mailing list initiated by Anne van Kesteren, who pointed out that in special cases, such as legal documents, list item markers can be part of the contents rather than of the styling:
> http://lists.whatwg.org/htdig.cgi/whatwg-whatwg.org/2010-February/024998.html
>
> Based on this discussion, and based on use cases out of my everyday work, I propose to add a possibility for taking list item markers from the contents of the li element.
>
>
> Use cases:
>
> All kinds of styling usually done with the combination of a hanging indent and a tabulator in word processors and layout applications. In practice they are often solved with tables or display:table-*. Some examples:
>
> 1. Legal documents where the list item markers are part of the cotent:
>
>   I. ........
>  II. ......
>  III. ..........
>
> §1    ..........
>      ......
> §1bis ...........
> $2    ........

This definitely needs to be supported.  Legal documents *must* have
the marker in the content, but we'd like to be able to format it as a
proper CSS marker.

> 2. Checkbox and radio button groups with multiline labels:
>
> o ........
>  .....
> o .........

I think this would help with some types of form layout.  Less
important, but would be nice.

> 3. CVs, recipies and whatever:
>
> 1966      .....
> 1973-1979 .........
>          ....
>
> 1 big orange ...............
> 2 onions     ...................
>             ........
> Not too much .................
> garlic       ..................
>             .....
>

Odd, but hey, if it falls out of the solution to the other two, I
don't have a problem with it.  I don't think this should be a definite
goal we should work towards, though.

> Possible solutions (alternatively):
>
> 1. Revive display:list-item-marker
>
> This possibility was mentioned by Tab Atkins Jr. in the WHATWG list discussion, here:
> http://lists.whatwg.org/htdig.cgi/whatwg-whatwg.org/2010-February/025014.html
>
> li input[type=radio], li span.marker {
>  display:list-item-marker;
> }
>
> <ul>
>  <li><input type="radio"> This label could be multiline</li>
>  <li><input type="radio"> Another option<li>
> </ul>
> <ol>
>  <li><span class="marker">§1</span> First paragraph text</li>
>  <li><span class="marker">§1bis</span> Second part of paragraph 1</li>
> </ol>

I'm not that happy with magic display values.  For one, it makes it
impossible to use display for what it's *intended* to do (frex, layout
the element as a table with display:table).

> 2. Introduce a new list-style-type:first-child
>
> The first child element of the <li> element is then displayed as the list item marker. (If the first child node is a text node, the default marker for ul resp. ol is displayed, as for list-style-type:image when the image file is missing.)
>
> ul, ol {
>  list-style-type:first-child;
> }
>
> <ul>
>  <li><input type="radio"> This label could be multiline</li>
>  <li><input type="radio"> Another option<li>
> </ul>
> <ol>
>  <li><span>§1</span> First paragraph text</li>
>  <li><span>§1bis</span> Second part of paragraph 1</li>
> </ol>

Hmm.  This has the benefit of author simplicity.  It has a downside of
also being pretty magical, in that a property set on the list affects
the display of a grandchild.  Not sure what my final opinion is on
this.


A third option is to adapt some concepts that GCPM uses.  It reuses
the float property to move footnotes and sidenotes into special areas,
through the very simple "float: footnote" or "float: sidenote".  We
could add a new value to this, "float: marker".  In terms of use, this
is identical to your first idea, it just avoids the abuse of display
that I dislike.  (I think reusing float is somewhat better, though
perhaps still not ideal.)

We'd just have to define exactly how the ::marker's content property
receives this, then.  Would content:normal allow accepting
marker-floats?  We'd have make it explicit that a marker-float
overrides list-style-type, then.  Perhaps a new list-style-type can be
used as well?  I'm not sure if this is necessary.


A fourth option is to use another concept from GCPM, that of Named
Flows.  Ideally, you'd use markup like this:

ul > li > .marker {
  float: to(marker);
}

ul > li::marker {
  content: from(marker);
}

This has the benefit of being very explicit about how things work.
However, Named Flows are not defined well enough to know if this sort
of thing is intended to be possible.  NF seems to be designed for
endnotes, where there's a single receiving element at the end of the
document, while this sort of use would have multiple receiving
elements.


There may be other methods we could use to activate this as well.  I
think the use-case is important to solve, but I don't have any idea
what the best way to do it is yet.  ^_^

~TJ
Received on Tuesday, 30 March 2010 21:18:23 GMT

This archive was generated by hypermail 2.3.1 : Tuesday, 26 March 2013 17:20:25 GMT