Three-level nested list in kramdown
I'm trying to create a nested list like the following (with kramdown, for use on GitHub pages), but the HTML output is not semantic; paragraphs are used instead of list items for a 2nd level list, and code blocks are used for 3rd level list items.
1. Do something.
2. Do something else.
a. If the reverse-Pi separation gauge is set to `OFF` you can follow
the following procedure.
i. Use the flux capacitor on Mondays, Tuesdays and Thursdays, but
only if you have not done so already.
ii. Do not use the flux capacitor if it raining, because the
universe will implode.
b. If the reverse-Pi separation gauge is set to `ON` then you
should follow Procedure 42.
3. Go back to doing things.
The above method creates the following HTML ...
<ol>
<li>
<p>Do something.</p>
</li>
<li>
<p>Do something else.</p>
<p>a. If the reverse-Pi separation gauge is set to <code>OFF</code> you can follow
the following procedure.</p>
<pre><code> i. Use the flux capacitor on Mondays, Tuesdays and Thursdays, but
only if you have not done so already.
ii. Do not use the flux capacitor if it raining, because the
universe will implode.
</code></pre>
<p>b. If the reverse-Pi separation gauge is set to <code>ON</code> then you
should follow Procedure 42.</p>
</li>
<li>
<p>Go back to doing things.</p>
</li>
</ol>
I've tried changing the indentation and even removing the blank lines between the elements, but I can't seem to get it to function as intended.
Replacing all bullets with 1.
rather than their actual numbers makes it generate properly structured HTML (thanks to Scroog1 for this offline suggestion); then you can use CSS to give the HTML output lists the desired result list-style-type
. However, this is contrary to Markdown's "it should be readable like a philosophy of plain text", so I was wondering if there is a way to make it work and look like it was supposed to in the markdown version?
(I suppose it could be argued that in this particular case, where HTML is the only format of my document that people will read, it is better for the machine to do the numbering, and cleaner to use CSS rather than inline styles generated by the markdown processor to achieve the list formatting I want, but I'm curious if the failure above could be my misuse or maybe a bug or design decision in kramdown.)
source to share
Make all ordered lists
1. Do something.
2. Do something else.
1. If the reverse-Pi separation gauge is set to `OFF` you can follow
the following procedure.
1. Use the flux capacitor on Mondays, Tuesdays and Thursdays, but
only if you have not done so already.
2. Do not use the flux capacitor if it raining, because the
universe will implode.
2 If the reverse-Pi separation gauge is set to `ON` then you
should follow Procedure 42.
3. Go back to doing things.
Then apply styles
li li{
list-style-type: lower-alpha;
}
li li li{
list-style-type: lower-roman;
}
See MDN on CSS
source to share
The Kramdown documentation does not provide examples of support for ordered lists other than numeric 1,2,3 ....
It uses the value of the first list indicator to determine if the list is ordered or unordered, and you can apply an inline style class with lists like this:
1. {:.cls} This item has the class "cls".
2. {:.cls} This item also as the class "cls".
This mostly reads plain text and makes it easier to manage your CSS (the 2-x style class may not be needed, I've never tried that).
source to share