Page MenuHomePhabricator

Add <div> around non-nested list item content
Open, Needs TriagePublic

Description

Nested lists such as:

: foo
:: bar

have a bit of a styling problem. The HTML generated is:

<dl>
<dd>foo
<dl><dd>bar
</dd></dl></dd></dl>

and with this DOM tree there's no way to highlight/box foo with a CSS style without also surrounding bar.

What we'd like is HTML structure more like:

<dl>
<dd><div>foo</div>
<dl><dd>bar
</dd></dl></dd></dl>

or even

<dl>
<dd>foo
</dd><dd>
<dl><dd>bar
</dd></dl></dd></dl>

The former we could probably convince the legacy parser and/or Parsoid to emit; basically creating an initial <div> for the item and closing it as soon as a nested list is encountered. The latter would probably require new wikitext syntax (or flag, which could be set on certain types of pages), since it's a non-backwards-compatible change to the list semantics.

No specific proposal yet; this task is initially for discussion.

Event Timeline

cscott created this task.Thu, Aug 22, 6:33 PM
Restricted Application added a subscriber: Aklapper. · View Herald TranscriptThu, Aug 22, 6:33 PM
Anomie added a subscriber: Anomie.Thu, Aug 22, 8:44 PM

You could just write the div into the wikitext, if you need it:

: <div class="...">foo</div>
:: bar

If the motivation for this was formatting of talk page comments that currently use definition lists, IMO we should provide people with markup that works more sanely for talk page comments, as is already being discussed in T230683: New syntax for multiline list items / talk page comments (which currently is unfortunately titled to conflate list items and talk page comments). Using wikitext list item markup for talk page comments has significant drawbacks for multi-paragraph comments, comments containing tables or lists, and so on, which aren't use cases normally encountered in actual lists.