Quantcast
Channel: Active questions tagged code-formatting - Meta Stack Overflow
Viewing all articles
Browse latest Browse all 189

What causes these list item marker display issues for content that begins with a code block?

$
0
0

Yesterday I made an edit that produced some unexpected output. It seems that when an item in an ordered or unordered list begins with a code block, in (at least) Firefox (but not Chrome) the list item marker is not vertically aligned with the content of the list item. As you can see in the first screenshot below, for such list items the marker appears to be aligned between the first and second line of code, and when there is only one line of code the marker appears to be aligned with the bottom of the item content. @Laurel also reports in the comments that for such list items the marker is missing entirely in Chrome and Safari for iOS.

Markdown input

1. The first list item is one line of text.2. ```lang-c   /* The second list item is one line of code. */   ```3. The third list item is three lines of text.   The third list item is three lines of text.   The third list item is three lines of text.4. ```lang-c   /* The fourth list item is three lines of code.      The fourth list item is three lines of code.      The fourth list item is three lines of code. */   ```5. The fifth list item is one line of text followed by three lines of code.   ```lang-c   /* The fifth list item is one line of text followed by three lines of code.      The fifth list item is one line of text followed by three lines of code.      The fifth list item is one line of text followed by three lines of code. */   ```6. ```lang-c   /* The sixth list item is three lines of codes followed by one line of text.      The sixth list item is three lines of codes followed by one line of text.      The sixth list item is three lines of codes followed by one line of text. */   ```   The sixth list item is three lines of codes followed by one line of text.

Markdown output

Incorrectly aligned list item markers in 64-bit Firefox v101.0.1 for Windows

Screenshot of 64-bit Firefox v101.0.1 for Windows showing that for Markdown list items that begin with a code block the list item marker is not vertically aligned with the list item content.

Correctly aligned list item markers in 64-bit Chrome v102.0.5005.115 for Windows

Screenshot of 64-bit Firefox v102.0.5005.115 for Windows showing that for Markdown list items that begin with a code block the list item marker is vertically aligned with the list item content.

Missing list item markers in Chrome for iOS

Screenshot of Google Chrome for iOS showing that for Markdown list items that begin with a code block the list item marker is missing.

Your browser

  1. The first list item is one line of text.

  2. /* The second list item is one line of code. */
  3. The third list item is three lines of text.

    The third list item is three lines of text.

    The third list item is three lines of text.

  4. /* The fourth list item is three lines of code.   The fourth list item is three lines of code.   The fourth list item is three lines of code. */
  5. The fifth list item is one line of text followed by three lines of code.

    /* The fifth list item is one line of text followed by three lines of code.   The fifth list item is one line of text followed by three lines of code.   The fifth list item is one line of text followed by three lines of code. */
  6. /* The sixth list item is three lines of codes followed by one line of text.   The sixth list item is three lines of codes followed by one line of text.   The sixth list item is three lines of codes followed by one line of text. */

    The sixth list item is three lines of codes followed by one line of text.


Viewing all articles
Browse latest Browse all 189

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>