How to create a 1.1, 1.2 1.3 … HTML list?

Question

I want to create HTML nested lists that has the following format:

1  
   1.1  
   1.2  
   1.3  
   1.4   
2
   2.1

I tried a solution that I f

Answer 1

this answer is for the first question. I suggest use this method if you are not going below IE8 (IE7 => ?). for below IE7 you can use same logic with jquery.

Original Post from
http://www.w3schools.com/cssref/pr_gen_counter-reset.asp

CSS

ul.numeric-decimals { counter-reset:section; list-style-type:none; }
ul.numeric-decimals li { list-style-type:none; }
ul.numeric-decimals li ul { counter-reset:subsection; }
ul.numeric-decimals li:before{
    counter-increment:section;
    content:counter(section) ". ";/*content:"Section " counter(section) ". ";*/
}
ul.numeric-decimals li ul li:before {
    counter-increment:subsection;
    content:counter(section) "." counter(subsection) " ";
}

HTML

Cats
Dogs
    

        
Birds
        
Rats
    

Rabbits
Ants
    

        
Lions
        
Rats
    

Ducks