When you use the {}
code formatting tool, it indents your code by four spaces. This indentation is then converted by the Markdown parser into a <pre><code>
block with all the special characters inside suitably escaped.
However, when the indented code appears after a list item, the four spaces acts instead as a continuation of the list item.
If you want the code block to appear inside the list item, you have to indent it using 8 spaces. (Note that it is not possible to start a list item with a code block; You need to put some text in first.)
If instead you want it to appear after the list, you can break them up with an HTML comment (<!-- -->
) or a language hint to trigger the correct syntax colouring if appropriate (<!-- language: lang-css -->
).
Most languages are rendered correctly without hints, but CSS in particular is rendered badly by the default parser.
If you don't want to use the Markdown features and instead want to write your own HTML, then you need to escape all special characters (eg. <
and &
) yourself. For example:
<pre><code>Different <> Diff</code></pre>
will be rendered as:
Different <> Diff
You can learn more about Markdown at: https://meta.stackoverflow.com/editing-help
<pre>
isn't for code formatting, and so understandably doesn't properly format code.