Hi, total css newbie here. I would like my numbered lists to look like what you see in Wittgenstein’s Tractatus logico-philosophicus, i.e. outlined lists (1, 1.1, 1.1.1, etc.) with no visible indentations at all for any sub-level:
1 TAB Main level paragraph.
1.1 TAB Sub-level paragraph. Numbering stays flush with the numbering above; text stays flush with text above for the entire paragraph (as if it was in its own column in a table).
1.1.1 TAB Further sub-level paragraph, same as above.
2. TAB Main level paragraph, etc.
So far I managed to create the following css code, but it has a few defects:
- TAB missing and therefore text not flush. I tried using “_____” but it ain’t pretty.
- Paragraphs don’t wrap nicely
Any help is welcome. I’m using Minimal theme:
ul {
padding-inline-start:0em;
list-style:none;
list-style-type:none;
}
ul ul, ol ul, ol ol ul, ol ul ul, ul ol ul, ul ul ul {
list-style:none;
list-style-type:none;
}
ol {
padding-left: 0em;
list-style:none;
counter-reset:section;
display:table;
}
li {
counter-increment:section;
display:table-row;
}
li::before {
content: counters(section,".") "____";
color:var(--text-faint);
text-align:left;
display: inline;
}
EDIT: for some reason, this code messes with the unordered list too, it creates an empty line next to the bullet.
