I am trying to create a markdown table where one of the column should have a checkbox.
I have tried the following:
| Db2WoC Plan | Total time | RPO,RTO met |
| ------------------------------------------- | --------- |-------------|
| Db2 on Cloud Entry/Enterprise 1 TB | 8:10:16 | <ul><li>[x] item1</li><li>[ ] item2</li></ul> |
| Db2 Warehouse on Cloud for transaction | 8:10:16 | - [x] ok |
| Db2 Warehouse on Cloud(AWS) | 8:10:16 | - [x] ok |
| Db2 Warehouse on Cloud(Softlayer) | 8:10:16 | - [x] ok |
But none of this work.
I see the following as a result:
Db2WoC Plan Total time RPO,RTO met
Db2 on Cloud Entry/Enterprise 1 TB 8:10:16 [x] item1
[ ] item2
Db2 Warehouse on Cloud for transaction 8:10:16 - [x] ok
Db2 Warehouse on Cloud(AWS) 8:10:16 - [x] ok
Db2 Warehouse on Cloud(Softlayer) 8:10:16 - [x] ok
The table shown in https://gist.githubusercontent.com/pchaigno/1826ba1151890b751862/raw/73399cc5a5d2415e2a75f58fd6959d25770c4ed3/checkboxes.md does not work as well.
Use an HTML entity (✓) or an emoji (:heavy_check_mark:).
The GitHub Markdown Spec specifically states:
Block-level elements cannot be inserted in a table.
List items are block level elements and are therefore not permitted within table cells. And task list items are simply another style of list item that happens to contain a checkbox. It you don't have a list item, then you can't have a task list item. In other words, you can not have task list items within table cells.
As the original Markdown rules explain:
For any markup that is not covered by Markdown’s syntax, you simply use HTML itself.
And, as a HTML checkbox would be an inline element, one might be tempted to insert a raw HTML checkbox directly into a table cell:
<input type="checkbox" checked>
However, there is the issue that GitHub's sanitation filter will remove the checkbox. In fact, GitHub's task lists doesn't use actual checkbox elements, but images of checkmarks.
A more useful option might be to use an HTML entity or emoji for a checkmark. For example:
| Description | Checkmark |
| ----------------------------------- | ----------------------- |
| HTML Entity: check mark | ✓ |
| HTML Entity: heavy check mark | ✔ |
| HTML Entity: ballot box with check | ☑ |
| HTML Entity: ballot box with x | ☒ |
| HTML Entity: ballot box (unchecked) | ☐ |
| Emoji: heavy check mark | :heavy_check_mark: |
| Emoji: ballot box with check | :ballot_box_with_check: |
| Emoji: white check mark | :white_check_mark: |
As you are using table cells, you probably don't need an unchecked box, the empty table cell will suffice. However, if you really want empty checkbox as well, the ballot box should work well for that.
I've added a comment to your gist which demonstrates what all of the above options look like on GitHub.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With