[WEB4LIB] CSS alternative to start & value for lists?

Thomas Dowling tdowling at ohiolink.edu
Thu Sep 20 11:09:14 EDT 2001


----- Original Message -----
From: "Robert Sullivan" <scp_sulli at sals.edu>

> I'm in the process of converting my site to CSS and XHTML.  I noticed
that the
> "start" and "value" attributes of ordered lists are deprecated and I'd
like to
> find another way of doing that.  I know that CSS will allow you to set
the list
> to Roman numerals etc., but haven't found this.

A similar question was asked recently on
comp.infosystems.www.authoring.stylesheets.  As I recall, the answer was
that the solution is buried so deep in CSS2 that there's no point in
trying to do it in CSS for the foreseeable future.  Stick with XHTML
Transitional and use the start attribute, knowing that you gave it your
best shot.

Just for funsies, I *think* this would be the way to do it.  It's hard to
tell for sure, since of Mozilla 0.9.4, IE6, and Opera 5.12, only Opera
touches this.  Since they don't make claims about CSS2 compliance, I'm a
little leery of relying on how they do it, but it seems to mesh with
<http://www.w3.org/TR/REC-CSS2/generate.html#counters>.

For two OL's, one starting at 1 and the other starting at 15 (that is,
after 14):

=============
<style type="text/css">

ol {
  list-style-type: none;
  /* Necessary for Opera at least.  Turns off the browser's
    auto-numbering */
  counter-reset: item;
  /* Sets the "item" counter to 0. */
}

ol.after-break {
  counter-reset: item 14;
  /* Starts  the "after-break" list with the "item" counter
    set to 14. */
}

li:before {
  counter-increment: item;
  /* Bumps the "item" counter up one for each list item
    Counter is incremented before the list item is displayed,
    so start at 0 and 14 for lists that begin with 1 and 15. */
  content: counter(item) ": ";
  /* Displays "[Number]: " before the list item */
}

</style>...


<ol>
<li>First item</li>
<li>Second item</li>
</ol>...

<ol class="after-break">
<li>Fifteenth item</li>
<li>Sixteenth item</li>
</ol>...
=============


Thomas Dowling
OhioLINK - Ohio Library and Information Network
tdowling at ohiolink.edu



More information about the Web4lib mailing list