What is the Markdown equivalent of the following HTML?
<ul><li>Here is a bullet point</li>
<li>Here is another bullet point; it has sub-points:
<ul><li>subpoint 1</li>
<li>subpoint 2</li>
<li>subpoint 3</li></ul>
but then continues with the original bullet point</li>
<li>and here's one more point just to drive it home</li>
</ul>
I cannot seem to have the "...but then continues with..." bit to remain in the same bullet point that encapsulates the sub-list. I have tried several variations of this:
* Here is a bullet point
* Here is another bullet point; it has sub-points:
* subpoint 1
* subpoint 2
* subpoint 3
but then continues with the original bullet point
* and here's one more point just to drive it home
with different indent levels for the "but then
," but no matter what it either joins with "subpoint 3
" or it just becomes another child indent under the bullet point. The particular behaviors also vary based on which flavor of Markdown I'm using.
Is this just too complicated to encapsulate in Markdown, and is a case where I should just use inline HTML instead?
To nest one list within another, indent each item in the sublist by four spaces. You can also nest other elements like paragraphs, blockquotes or code blocks. You can mix ordered and unordered lists. To nest a paragraph or blockquote, indent by either 4 spaces or one tab.
You can create bullet points in an unordered list in markdown format using an asterisk “*” at the beginning of the line. Links can be inserted anywhere in the readme.md.
You need to include some blank lines to tell Markdown when to start the list, when to end the list, when to start a paragraph (which not in the list) etc...
* Here is a bullet point
* Here is another bullet point; it has sub-points:
* subpoint 1
* subpoint 2
* subpoint 3
but then continues with the original bullet point
* and here's one more point just to drive it home
Which renders as:
<ul>
<li>Here is a bullet point</li>
<li>
<p>Here is another bullet point; it has sub-points:</p>
<ul>
<li>subpoint 1</li>
<li>subpoint 2</li>
<li>subpoint 3</li>
</ul>
<p>but then continues with the original bullet point</p>
</li>
<li>
<p>and here's one more point just to drive it home</p>
</li>
</ul>
The key is to think of everything nested in the list item to be its own standalone Markdown document which is indented four spaces from the rest of the document. In that case, you would need to add a blank line between the last list item and the paragraph that follows, so you do here as well.
One thing to note is that the output this generates includes the side-effect that you now have a "lazy list". That is, the contents of the list items are now wrapped in <p>
tags. This is strictly enforced in the rules:
If list items are separated by blank lines, Markdown will wrap the items in
<p>
tags in the HTML output.
If you don't want the extra <p>
tags, then you can't have more than one block level element nested inside a list item.
Finally, I'll note that in the example above the first list item did not get the <p>
tags. While it is not documented one way or another in the rules, this is the behavior of the original reference implementation (only list items which border a blank line (the item before and after the blank line) get <p>
tags). While some implementations have copied this behavior, not all have and there are various edge cases that differ between them. For consistency across implementations, I find it to be a good practice to include a blank line between each list item if I need to use a blank line anywhere within a list. Therefore I would do this:
* Here is a bullet point
* Here is another bullet point; it has sub-points:
* subpoint 1
* subpoint 2
* subpoint 3
but then continues with the original bullet point
* and here's one more point just to drive it home
Which should more consistently render as:
<ul>
<li>
<p>Here is a bullet point</p>
</li>
<li>
<p>Here is another bullet point; it has sub-points:</p>
<ul>
<li>subpoint 1</li>
<li>subpoint 2</li>
<li>subpoint 3</li>
</ul>
<p>but then continues with the original bullet point</p>
</li>
<li>
<p>and here's one more point just to drive it home</p>
</li>
</ul>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With