In all three sets of tests, I recommend that the bullet is aligned
vertically with the line of text, and that the bullet is always positioned
a constant distance from the border edge of the LI (i.e., a constant
distance outside the red border). This makes the implementation of
list bullets forward-compatible with CSS2 markers. However, it is
not required.

These three DIVs (one, two,
and three) have CLASS="first".

Vertically,
there should be white, 20px of light green, 40px of dark green, 20px of
light red, 20px of dark red, the text (with gray background), 20px
of dark red, 20px of light red, 20px of dark green, 20px of light red,
20px of dark red, the text (with gray background), 20px of dark red,
20px of light red, 40px of dark green, 20px of light green, 20px of
white, then the same pattern repeated with all the units cut in half (except
the height of the text), 10px of white, and then the text (with gray
background) with dark red to its right.

Horizontally, there should be 20px/10px/0 of light gray, 20px/10px/0
of light green, 40px/20px/0 of dark green, 20px/10px/0 of light red,
20px/10px/0 of dark red, the text (with gray background), a large
expanse of dark red (assuming the viewport is wide), 20px/10px/0 of
light red, 40px/20px/0 of dark green, 20px/10px/0 of light green, and
20px/10px/0 of light gray. The margin and padding of HTML and BODY
should be on either side of that, but nothing else.

This is a list item.

This is another list item.

This is a list item.

This is another list item.

This is a list item.

This is another list item.

These three DIVs (one, two,
and three) have CLASS="second".

The only differences with the previous set of tests should be
the vertical and horizontal distribution of light gray. There
should be 20px more of light gray on the horizontal sides,
everywhere. In the vertical (instead of the white between the
lists), there should be 40px above the first test, 70px between
the first and second, 50px between the second and third, and
20px below the third.