How to write lists inside a markdown table?

HtmlMarkdownGithub Flavored-Markdown

Html Problem Overview


Can one create a list (bullets, numbered or not) inside a markdown table.

A table looks like this:

| Tables        | Are           | Cool  |
| ------------- |:-------------:| -----:|
| col 3 is      | right-aligned | $1600 |
| col 2 is      | centered      |   $12 |
| zebra stripes | are neat      |    $1 |

A list looks like this:

* one
* two
* three

Can I merge them somehow?

Html Solutions


Solution 1 - Html

Yes, you can merge them using HTML. When I create tables in .md files from Github, I always like to use HTML code instead of markdown.

Github Flavored Markdown supports basic HTML in .md file. So this would be the answer:

Markdown mixed with HTML:

| Tables        | Are           | Cool  |
| ------------- |:-------------:| -----:|
| col 3 is      | right-aligned | $1600 |
| col 2 is      | centered      |   $12 |
| zebra stripes | are neat      |    $1 |
| <ul><li>item1</li><li>item2</li></ul>| See the list | from the first column|

Or pure HTML:

<table>
  <tbody>
    <tr>
      <th>Tables</th>
      <th align="center">Are</th>
      <th align="right">Cool</th>
    </tr>
    <tr>
      <td>col 3 is</td>
      <td align="center">right-aligned</td>
      <td align="right">$1600</td>
    </tr>
    <tr>
      <td>col 2 is</td>
      <td align="center">centered</td>
      <td align="right">$12</td>
    </tr>
    <tr>
      <td>zebra stripes</td>
      <td align="center">are neat</td>
      <td align="right">$1</td>
    </tr>
    <tr>
      <td>
        <ul>
          <li>item1</li>
          <li>item2</li>
        </ul>
      </td>
      <td align="center">See the list</td>
      <td align="right">from the first column</td>
    </tr>
  </tbody>
</table>

This is how it looks on Github:

>

Solution 2 - Html

If you want a no-bullet list (or any other non-standard usage) or more lines in a cell use <br />

| Event         | Platform      | Description |
| ------------- |-----------| -----:|
| `message_received`| `facebook-messenger`<br/>`skype`|

Solution 3 - Html

Not that I know of, because all markdown references I am aware of, like this one, mention:

> Cell content must be on one line only

You can try it with that Markdown Tables Generator (whose example looks like the one you mention in your question, so you may be aware of it already).

Pandoc

If you are using Pandoc’s markdown (which extends John Gruber’s markdown syntax on which the GitHub Flavored Markdown is based) you can use either grid_tables:

> +---------------+---------------+--------------------+ > | Fruit | Price | Advantages | > +===============+===============+====================+ > | Bananas | $1.34 | - built-in wrapper | > | | | - bright color | > +---------------+---------------+--------------------+ > | Oranges | $2.10 | - cures scurvy | > | | | - tasty | > +---------------+---------------+--------------------+

or multiline_tables.

> ------------------------------------------------------------- > Centered Default Right Left > Header Aligned Aligned Aligned > ----------- ------- --------------- ------------------------- > First row 12.0 Example of a row that > spans multiple lines. >
> Second row 5.0 Here's another one. Note > the blank line between > rows. > -------------------------------------------------------------

Solution 4 - Html

another solution , you can add <br> tag to your table

    |Method name| Behavior |
    |--|--|
    | OnAwakeLogicController(); | Its called when MainLogicController is loaded into the memory , its also hold the following actions :- <br> 1. Checking Audio Settings <br>2. Initializing Level Controller|

enter image description here

Solution 5 - Html

An alternative approach, which I've recently implemented, is to use the div-table plugin with panflute.

This creates a table from a set of fenced divs (standard in the pandoc implementation of markdown), in a similar layout to html:

---
panflute-filters: [div-table]
panflute-path: 'panflute/docs/source'
---

::::: {.divtable}
:::: {.tcaption}
a caption here (optional), only the first paragraph is used.
::::
:::: {.thead}
[Header 1]{width=0.4 align=center}
[Header 2]{width=0.6 align=default}
::::
:::: {.trow}
::: {.tcell}

1. any
2. normal markdown
3. can go in a cell

:::
::: {.tcell}
![](https://pixabay.com/get/e832b60e2cf7043ed1584d05fb0938c9bd22ffd41cb2144894f9c57aae/bird-1771435_1280.png?attachment){width=50%}

some text
:::
::::
:::: {.trow bypara=true}
If bypara=true

Then each paragraph will be treated as a separate column
::::
any text outside a div will be ignored
:::::

Looks like:

enter image description here

Solution 6 - Html

If you use the html approach:

don't add blank lines

Like this:

<table>
    <tbody>

        <tr>
            <td>1</td>
            <td>2</td>
        </tr>

        <tr>
            <td>1</td>
            <td>2</td>
        </tr>

    </tbody>
</table>

the markup will break.

Remove blank lines:

<table>
    <tbody>
        <tr>
            <td>1</td>
            <td>2</td>
        </tr>
        <tr>
            <td>1</td>
            <td>2</td>
        </tr>
    </tbody>
</table>

Solution 7 - Html

If you happen to be using Kramdown (the default Markdown renderer for Jekyll) then you have to use the nomarkdown extension {::nomarkdown}...{:/}.

For example:

| Tables        | Are           | Cool  |
| ------------- |:-------------:| -----:|
| col 3 is      | right-aligned | $1600 |
| col 2 is      | centered      |   $12 |
| {::nomarkdown}<ul><li>one</li><li>two</li><li>three</li></ul>{:/} | Kramdown | bullets |

Solution 8 - Html

For Python markdown, I recommend using the GridTables markdown extension. In particular, the forked version I linked has worked best for me with mkdocs-material, and it supports lists and most markdown formatting. Multiline code blocks will not render well.

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionGabriel PetrovayView Question on Stackoverflow
Solution 1 - HtmlIonică BizăuView Answer on Stackoverflow
Solution 2 - HtmlAmio.ioView Answer on Stackoverflow
Solution 3 - HtmlVonCView Answer on Stackoverflow
Solution 4 - HtmlVectorXView Answer on Stackoverflow
Solution 5 - HtmlChris SewellView Answer on Stackoverflow
Solution 6 - HtmlDiogo GomesView Answer on Stackoverflow
Solution 7 - HtmlJohnny BaloneyView Answer on Stackoverflow
Solution 8 - HtmlCapitalDotView Answer on Stackoverflow