Question

Possible Duplicate:
Achieving sub numbering on ol items html

I’m trying to achieve something like this by using unordered list:

1. Title

Objective: some text here…

     1.1 option1
     1.2 option2
     1.3 option3

2. Title

Objective: some text here…

     2.1 option1
     2.2 option2
     2.3 option3

---

I tried using list-style: decimal; but that only achieves numbers like 1, 2, 3 etc whereas I need them to have format of 1.2 , 1.3 … 2.1 ,2.3 etc. Also is this achievable by using one unordered list or will I need to use several?

Answer 1

In one of my projects, I used this code (demo)

(I don’t remember where did I get it from, but it works)

ol{ 
    counter-reset: listing ;
}
li { 
    display: block ;
}
li:before { 
    content: counters(listing, ".") " "; 
    counter-increment: listing ;
}

This method gives you controller over many other things of course: you can customize the counter as you pleased using the content property