ansaurus

Question

Ordered Lists <OL>, Starting index with XHTML Strict?

Answer 1

+1 A:

The CSS solution is to use a list counter: http://www.w3.org/TR/CSS2/generate.html#counters

And it seems that, to support paging, you could simply put a hardcoded <style> element into the <head>, or set the style explicitly on the element (haven't tried either, so ymmv).

kdgregory 2009-01-28 13:14:55

Answer 2

A:

You could definitely use counters but maybe a more practical solution would be to use an XHTML Transitional doctype. I know this doesn't answer your question but this is one of those situations where you can end up coding up the walls and across the ceiling to do something that doesn't gain you much.

Andrew Hare 2009-01-28 13:17:47

Answer 3

+7 A:

As kdgregory noted, counters would be the way to accomplish this and still maintain a valid document. This article on Array Studio shows how to code this in XHTML and CSS. The following is copied from their article:

You need to write the following in your CSS:

OL#page_one { counter-reset: item }
OL#page_two { counter-reset: item 5 }
LI { display: block }
LI:before {
    content: counter(item) ". ";
    counter-increment: item;
    display:block;
}

And, this is how your lists should be defined:

<ol id="page_one">
    <li>Division Bell</li>
    <li>Atom Hearth Mother</li>
    <li>Relics</li>
    <li>Dark Side of the Moon</li>
    <li>Wish You Were Here</li>
</ol>

<ol id="page_two">
    <li>The Wall</li>
    <li>More</li>
    <li>Piper at the gates of Dawn</li>
    <li>Final Cut</li>
    <li>Meddle</li>
</ol>

Daan 2009-01-28 14:00:55

+1for the full example - although I can't say I agree with your lists (where's Animals?!?), and the pagination shouldn't be hardcoded in a CSS file (what if you have 500 pages?)

kdgregory 2009-01-28 14:04:25

The original article already mentions that server side technology can be used to enhance this script. You can also choose to implement the pagination using such a script, which would indeed be better than hard-coding it. This code simply shows the html / css part of the technique.

Daan 2009-01-28 14:24:22

+1 for a necessary solution to an unnecessary problem.

Josiah 2009-08-20 05:40:29

ansaurus

tags:

views:

answers:

Ordered Lists <OL>, Starting index with XHTML Strict?

related questions