- From: Tab Atkins Jr. <jackalmage@gmail.com>
- Date: Thu, 21 Apr 2016 11:24:07 -0700
- To: www-style list <www-style@w3.org>
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? ~TJ
Received on Thursday, 21 April 2016 18:24:54 UTC