Re: [css-lists][html] <summary> and ::marker

> On Apr 22, 2016, at 03:24, Tab Atkins Jr. <jackalmage@gmail.com> wrote:
> 
> Recently HTML, under advisement from fantasai and I, specified that
> the "disclosure triangle" on a <summary> element (part of the
> <details> element) is displayed using a list marker, by setting
> <summary> to display:list-item.
> 
> Unfortunately, this decision came with some additional baggage that
> we're now having to work around in HTML.  In particular:
> 
> * display:list-item also automatically increments the list-item
> counter, which is used by HTML's <ol> element.  This meant that using
> a <details> inside of an <ol> would cause the next <li> to jump ahead
> by 2.
> * <summary> uses list-style-position:inside, and list-style-*
> properties inherit, so if you use an HTML list inside of a <summary>,
> its markers will be "inside" position as well.  (HTML purposely
> doesn't set list-style-position, so that if you make an outer list
> "inside" the nested lists will be too. By default, tho, they use the
> initial "outside" value, and that's the expected way for them to
> display.)
> 
> Both of these have fixes - the first by setting "summary {
> counter-increment: list-item 0; }", the second by setting "summary > *
> { list-style-position: initial; }" - but they still make things
> messier than they have to.
> 
> I propose a simple solution: rather than having "display:list-item"
> cause the ::marker to be generated, as is specced today, we make
> ::marker *always* exist, identical to ::before.  For normal elements
> you have to explicitly give it a 'content' value, just like ::before.
> "display:list-item" then just makes the ::marker pay attention to the
> list-style-* properties.
> 
> This would let us swap the <summary> UA style back to just:
> 
> summary {
>  display: block;
> }
> summary::marker {
>  content: disclosure-closed;
> }
> details[open] > summary::marker {
>  content: disclosure-open;
> }
> 
> (We'd also redefine disclosure-open/closed from being counter styles
> to just being 'content' keywords with the same effect.)
> 
> fantasai offers an alternate proposal: leave <summary> as is, leave
> the hack for the first problem, but make the list-style-* properties
> actually only apply to the ::marker pseudo, rather than to list items.
> Inheritance ensures that we maintain today's behavior, but HTML can
> then set list-style-position:inside directly on the summary::marker,
> and avoid the second problem entirely.
> 
> Thoughts?

I like your (Tab's) proposal better. It's easy to understand, easy to use, avoids overloading the semantics implied by "display:list-item". Also, it gives us one more pseudo element to use and abuse for all sorts of effects, which I expect will be very welcome by authors.

 - Florian

Received on Friday, 22 April 2016 00:55:56 UTC