Question

Could someone tell me why the following code isn't numbering properly? I'm following the instructions from http://jsfiddle.net/N79nP/ however the numbering doesn't continue past 1. I'm very new to coding so any help would be greatly appreciated!

    <ol class="inhoudsopgave">
    <li class="inhoudsopgave"><a href="#"></a></li>
    <ol class="inhoudsopgave">
        <li class="inhoudsopgave"><a href="#</a></li>
        <ol class="inhoudsopgave">
            <li class="inhoudsopgave"><a href="#</a>
            <li class="inhoudsopgave"><a href="#"></a></li>
            <li class="inhoudsopgave"><a href="#"></a></li>
        </ol>
    </ol>   
    <ol class="inhoudsopgave">
        <li class="inhoudsopgave"><a href="#"></a></li>
        <ol class="inhoudsopgave">
            <li class="inhoudsopgave"><a href="#"></a></li>
            <li class="inhoudsopgave"><a href="#"></a></li>
            <li class="inhoudsopgave"><a href="#"></a></li>
            <li class="inhoudsopgave"><a href="#"></a></li>
        </ol>
    </ol>   
    <ol class="inhoudsopgave">      
        <li class="inhoudsopgave"><a href="#"></a></li>
        <ol class="inhoudsopgave">
            <li class="inhoudsopgave"><a href="#"></a></li>
            <li class="inhoudsopgave"><a href="#"></a></li>
            <li class="inhoudsopgave"><a href="#"></a></li>
        </ol>
    </ol>   
    <ol class="inhoudsopgave">  
        <li class="inhoudsopgave"><a href="#"></a></li>
        <ol class="inhoudsopgave">
            <li class="inhoudsopgave"><a href="#"></a></li>
            <li class="inhoudsopgave"><a href="#"></a></li>
            <li class="inhoudsopgave"><a href="#"></a></li>
            <li class="inhoudsopgave"><a href="#"></a></li>
            <li class="inhoudsopgave"><a href="#"></a></li>
        </ol>
    </ol>
</ol>
Was it helpful?

Solution

In short, your list is a mess. You are nesting your OLs inside OLs. If you want to have a list with sub lists, the heiarchy should look like this.

<ol class="inhoudsopgave">
    <li class="inhoudsopgave"><a href="#"></a>
    <ol class="inhoudsopgave">
        <li class="inhoudsopgave"><a href="#"></a></li>
        <li class="inhoudsopgave"><a href="#"></a></li>
        <li class="inhoudsopgave"><a href="#"></a></li>
        <li class="inhoudsopgave"><a href="#"></a></li>
    </ol>
</li>
<li class="inhoudsopgave"><a href="#"></a>
    <ol class="inhoudsopgave">
        <li class="inhoudsopgave"><a href="#"></a></li>
        <li class="inhoudsopgave"><a href="#"></a></li>
        <li class="inhoudsopgave"><a href="#"></a></li>
        <li class="inhoudsopgave"><a href="#"></a></li>
    </ol>
</li>
</ol>
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top