Code block is not properly formatted when placed immediately after a list item [duplicate]

Question

Consider the following piece of Markdown code:

This is some regular text.

    >>> def factorial(n):
    ...     return 1 if n < 2 else n * factorial(n - 1)
    ... 

* This is a list item.

    >>> def factorial(n):
    ...     return 1 if n < 2 else n * factorial(n - 1)
    ... 

Notice that the second code block is preceded by a list item.

Why is the factorial code not properly formatted under these circumstances? To demonstrate the problem, I'll insert the Markdown code show above:

---

This is some regular text.

>>> def factorial(n):
...     return 1 if n < 2 else n * factorial(n - 1)
... 

• This is a list item

  def factorial(n): ... return 1 if n < 2 else n * factorial(n - 1) ...

---

This applies to numbered as well as unnumbered lists.

Answer 1

Unfortunately, this is an ambiguity in the Markdown specification. This markdown source:

42. list item

    more text

can mean two things. One of them is the one you're expecting: more text is following a blank line and indented by four spaces, making it a top-level (i.e. not part of the list) code block.

The second possible meaning is this:

List items may consist of multiple paragraphs. Each subsequent paragraph in a list item must be indented by either 4 spaces or one tab:

1.  This is a list item with two paragraphs. Lorem ipsum dolor
    sit amet, consectetuer adipiscing elit. Aliquam hendrerit
    mi posuere lectus.

    Vestibulum enim wisi, viverra nec, fringilla in, laoreet
    vitae, risus. Donec sit amet nisl. Aliquam semper ipsum
    sit amet velit.

– in other words, more text is a regular second paragraph within the list item.

It's indistinguishable which of the two meanings is the intended one; both are correct. And what the Markdown converter (actually, all of them) chooses is the second meaning.

The only way to fix this would be adding an additional syntax to Markdown, enabling you to distinguish the two. I can, however, not think of any intutitive and unobtrusive thing to do, so using one of the workarounds here is as good as anything. My preferred workaround, by the way, would be an HTML comment like this:

* list item

<!-- -->

    code

turns into this:

• list item

code

– but it doesn't really matter which one you use. Bottom line is: As sad as it is, this is unfixable.

Answer 2

I've noticed that I usually have to add 8 spaces before any code instead of 4 spaces when it's code that appears as part of a list item.

<- 4 spaces

• A list item (one blank line after this):

  <- 8 spaces
  

Answer 3

The workaround which is to add 8 spaces instead of simply 4 is actually written in the markdown editing help:

1. (...)
2. (...)
3. (...)

4. Preformatted text in a list item:

   Skip a line and indent eight spaces.
   That's four spaces for the list
   and four to trigger the code block.
   

Answer 4

It's a crappy work-around, but you can do insert a backticked space to trick it. Put a space into those backticks and it should work:

• This is a list item.

``

>>> def factorial(n):
...     return 1 if n < 2 else n * factorial(n - 1)
...

See?

• This is a list item.

>>> def factorial(n):
...     return 1 if n < 2 else n * factorial(n - 1)
...

Answer 5

I'm glad there are workarounds for this, but this is really a bug that should be fixed. I just wasted altogether too much time trying to figure out why I couldn't put a code block after...

1. Bullet 1.
2. Bullet 2.

3. Paste in the following code:

   this.IsCode = true;

So here's my attempt with 8 spaces.

1. Bullet 1.
2. Bullet 2.

3. Paste in the following code:

   this.IsCode = true;
   this.IsAlsoCode = true;
   

4. Okay, so every line of code needs to be proceded by 8 spaces (instead of the usual 4).

Answer 6

I just found a solution for this.

If you put a </ul> after the listed item. The issue will be fixed.

Answer 7

This just got bumped. I'm looking through the answers. All the workarounds are hacky. So you should probably go with the following if you want the most semantically benign workaround:

- A list item.

<!-- language: lang-c++ -->

    int k = 1;
    char *something = "example";

That is, use an explicit syntax highlighting override before the code block (use the appropriate language from that post, or use default). This would be acceptable anyways, so it isn't some strange hacky HTML tag or empty comment or whatever. Since it's the normal usage of this feature, it's not going to risk breaking anything or looking weird in the future, either.

The above produces the following:

---

• A list item.

int k = 1;
char *something = "example";

Answer 8

• You can use a <pre><code> block around the code instead of indenting by 4 spaces or a tab. Certain characters may have to be escaped, such as <.

print "<code>"

The above line in markdown is <pre><code>print "&lt;code>"</code></pre>

Answer 9

I placed a <br\> after ordered List and code started working with same 4 space rule.