Valid replacement for <ol type=”a”>

September 16th, 2008

I was recently sent this question:

I have used <ol type=”a”> in my markup. The W3C validator tells me that this is invalid. How can I change the “type” of an ordered list’s the list without using this attribute?

Answer:

The type attribute associated with the <ul> , <ol> and <li> has been deprecated as it is considered style information. This means it should be achieved using CSS rather than markup.

Ideally, authors should use the list-style-type property which can specify a wide range of options including:

  • disc
  • circle
  • square
  • decimal
  • decimal-leading-zero
  • lower-roman
  • upper-roman
  • lower-greek
  • lower-alpha
  • lower-latin
  • upper-alpha
  • upper-latin
  • hebrew
  • armenian
  • georgian
  • cjk-ideographic
  • hiragana
  • katakana
  • hiragana-iroha
  • katakana-iroha

So, the preferred markup would be something like:

HTML:

<ol class=”lower-alpha” class=”class-name”>

CSS:

.class-name { list-style-type: lower-alpha; }