Test on 'list-style-type'

Back to October 2006

Table of contents

  1. The 'list-style-type' property
  2. Glyphs
  3. Numbering systems
  4. Alphabetic systems
  5. 4.1Test-case on alphabetic systems

1. The 'list-style-type' property

Marker types for lists are grouped in three sets of markers: glyphs, numbering systems and alphabetic systems. Here is a brief overview:

Glyphs
  1. disc
  2. circle
  3. square
Numbering systems
  1. decimal
  2. decimal-leading-zero
  3. lower-roman
  4. upper-roman
  5. georgian
  6. armenian
Alphabetic systems
  1. lower-latin or lower-alpha
  2. upper-latin or upper-alpha
  3. lower-greek

2. Glyphs

Disc

Circle

Square

Comments

Results look similar in all browsers (Internet Explorer 6, Firefox 1.5, Opera 9). The only difference lies in the marker's shape and dimension, but that is correct according to specs.

3. Numbering systems

Decimal

  1. Item one
  2. Item two
  3. Item three

Decimal-leading-zero

  1. Item one
  2. Item two
  3. Item three

Lower-roman

  1. Item one
  2. Item two
  3. Item three

Upper-roman

  1. Item one
  2. Item two
  3. Item three

Georgian

  1. Item one
  2. Item two
  3. Item three

Armenian

  1. Item one
  2. Item two
  3. Item three

Comments

Internet Explorer 6 doesn't support the 'decimal-leading-zero', 'georgian' and 'armenian' values. The following image shows the rendering in the other browsers of 'georgian' and 'armenian' values:

Georgian and armenian values rendering

4. Alphabetic systems

Lower-latin or lower-alpha

  1. Item one
  2. Item two
  3. Item three

Upper-latin or upper-alpha

  1. Item one
  2. Item two
  3. Item three

Lower-greek

  1. Item one
  2. Item two
  3. Item three

Comments

Internet Explorer 6 supports 'lower-alpha' ( and not 'lower-latin') and 'upper-alpha' (and not 'upper-latin') only. It doesn't support the 'lower-greek' value. The following image shows the rendering of 'lower-greek' value:

Lower-greek value rendering

4.1 Test-case on alphabetic systems

The CSS specifications don't define the rendering of alphabetic systems after the end of the sequence of letters contained in an alphabet (i.e. after 26 list items). So the rendering is undefined.

  1. Item 1
  2. Item 2
  3. Item 3
  4. Item 4
  5. Item 5
  6. Item 6
  7. Item 7
  8. Item 8
  9. Item 9
  10. Item 10
  11. Item 11
  12. Item 12
  13. Item 13
  14. Item 14
  15. Item 15
  16. Item 16
  17. Item 17
  18. Item 18
  19. Item 19
  20. Item 20
  21. Item 21
  22. Item 22
  23. Item 23
  24. Item 24
  25. Item 25
  26. Item 26
  27. Item 27

After 27 list items, all browsers render the 27th list item with a double "a" ('aa'), restarting from the beginning of the alphabetic system.