Collapse-Pro-Matic Spacing

monkey
this is a monkey

This is some text

Here is a headline

100-1 First thing
100-2 Second Thing

a. First Sub thing
b. Second sub thing

100-3 Third Thing
100-4 Forth Thing
100-5 Fifth Thing

I am bold.
Some info:
Here is some info that explains more about thing five.

100-6 Sixth Thing
100-7 Seventh Thing

Numbered List Items

<ul class="numbers">
    <li data-pos="2">one</li>
    <li data-pos="2">two
        <ul>
            <li data-pos="2">two.one</li>
            <li data-pos="2">two.two</li>
            <li data-pos="2">two.three</li>
        </ul>
    </li>
</ul>

- one

- two
  - - two.one
  - - two.two
  - - two.three

- three
  - - three.one
  - - three.two
      - three.two.one – this is a much longer piece of text that will wrap around and should display how the padding and offset of the numbering works with a longer text.
      - three.two.two

four

CSS:

ul.numbers {
    counter-reset: levelone;
    list-style: none;
}

ul.numbers > li {
    counter-increment: levelone;
}

ul.numbers > li[data-pos]:before {
    content: attr(data-pos) "." counters(levelone, ".") ". ";
}

ul.numbers ul {
    counter-reset: leveltwo;
    list-style: none;
}

ul.numbers ul > li {
    counter-increment: leveltwo;
}

ul.numbers ul > li[data-pos]:before {
    content: attr(data-pos) "." counters(levelone, ".") "." counters(leveltwo, ".") ". ";
}

ul.numbers ul ul {
    counter-reset: levelthree;
    list-style: none;
}

ul.numbers ul ul > li {
    counter-increment: levelthree;
}

ul.numbers ul ul > li[data-pos]:before {
    content: attr(data-pos) "." counters(levelone, ".") "." counters(leveltwo, ".") "." counters(levelthree, ".") ". ";
}