The discussion revolves around the issue of checkboxes not working well with unordered list bullets in a specific context. xiasummer first pointed out the problem, showing how checkboxes in unordered lists within numbered lists do not display bullets. tobiaseigen suggested that this might be intentional and provided examples of using bulleted lists with checkboxes, which indent nicely but do not display bullets.
xiasummer countered that this solution does not work for their specific use case, where they have long sentences and need the bullets for clarity. tobiaseigen attempted to recreate the issue with longer sentences, but the problem persisted.
tobiaseigen confirmed that the issue arises when combining numbered lists with bulleted lists and checklist items. Canapin offered a CSS hack to display or hide the bullets, providing a temporary solution to the problem.
Seems that check list is not working very well with “*”
Although it works fine with “1.”
1. [] Tasks in Stage 1
* [] Do 1 (The Black Point will disappear here)
* [] Do 2
1. [] Tasks in state 2
Tasks in Stage 1
Do 1 (Although the spacing is good, but the dot disappears)
Do 2
Tasks in state 2
I’ve noticed that recently too, but I think it may be intentional and I actually prefer it this way. The * or - lets you indent your checklist items into structured lists without the added noise of the bullet point.
- [] Milestone 1
- [] task 1
- [] task 2
- [] task 3
- [] Milestone 2
- [] task 1
- [] task 2
- [] task 3
vs
[] Milestone 1
[] task 1
[] task 2
[] task 3
[] Milestone 2
[] task 1
[] task 2
[] task 3
Milestone 1
task 1
task 2
task 3
Milestone 2
task 1
task 2
task 3
I see your demonstration, the “sub-checklist” works fine in your example, but not in mine.
You see, when the first level “ordered list”, and the second level is unordered list, it works not very fine.
And, I usually write very long sentences, in that way, it will not be very clear like in your example (in your example, the checklists are very short, like a few words), so it will be not very clean without a “dot”.
ok, let’s see…
- [] Milestone 1 described with several words that go over onto several lines. Still going to write my long, long, long line. I think that’ll be enough.
- [] task 1 described with several words that go over onto several lines. Still going to write my long, long, long line. I think that’ll be enough.
- [] task 2 described with several words that go over onto several lines. Still going to write my long, long, long line. I think that’ll be enough.
- [] task 3 described with several words that go over onto several lines. Still going to write my long, long, long line. I think that’ll be enough.
- [] Milestone 2 described with several words that go over onto several lines. Still going to write my long, long, long line. I think that’ll be enough.
- [] task 1 described with several words that go over onto several lines. Still going to write my long, long, long line. I think that’ll be enough.
- [] task 2 described with several words that go over onto several lines. Still going to write my long, long, long line. I think that’ll be enough.
- [] task 3 described with several words that go over onto several lines. Still going to write my long, long, long line. I think that’ll be enough.
1. [] Milestone 1 described with several words that go over onto several lines. Still going to write my long, long, long line. I think that’ll be enough.
- [] task 1 described with several words that go over onto several lines. Still going to write my long, long, long line. I think that’ll be enough.
- [] task 2 described with several words that go over onto several lines. Still going to write my long, long, long line. I think that’ll be enough.
- [] task 3 described with several words that go over onto several lines. Still going to write my long, long, long line. I think that’ll be enough.
2. [] Milestone 2 described with several words that go over onto several lines. Still going to write my long, long, long line. I think that’ll be enough.
- [] task 1 described with several words that go over onto several lines. Still going to write my long, long, long line. I think that’ll be enough.
- [] task 2 described with several words that go over onto several lines. Still going to write my long, long, long line. I think that’ll be enough.
- [] task 3 described with several words that go over onto several lines. Still going to write my long, long, long line. I think that’ll be enough.
I can confirm that when you combine numbered lists with bulleted lists, followed by checklist items, it does not indent as you might expect because it does not show the bullets.
Personally I like using bulleted lists with checklist as in my example above, which indents nicely and does not show the actual bullets. But that also is not displaying as you might expect.
The reason for both of these might be the same.
Here’s a hacky CSS fix if you need it, @xiasummer:
Displays the bullet
.cooked ol ul li.has-checkbox {
margin-left: 1em;
list-style-type: initial;
.list-item-checkbox {
left: 0;
position: relative;
}
}
Hide the bullet:
.cooked ol ul li.has-checkbox {
margin-left: 1em;
}
