List inside a list

Sunamena · July 18, 2016

I placed a few orderd lists inside another orderd list to have a nested structure.
On my screen, i have what i was going for and it works perfectly and works user friendly.

However, HTML validator says I have a few errors (only on my nested list). I have cut down the code to sayd code.

So how should i solve this problem?
Is this an error inside the validator itself? Since it seems to be working perfectly.

Kind regards =D

Code:

<!DOCTYPE html>

<head>

<title>Title</title>

</head>

<body>

<ol>

<li><a href="#lijst1">Getting Started</a></li>

<ol>

<li><a href="#lijst11">Where to obtain crew skills?</a></li>

<li><a href="#lijst12">Crew Window</a></li>

</ol>

<li><a href="#lijst2">Type of crew skills</a></li>

<ol>

<li><a href="#lijst21">Crafting skill</a></li>

<ol>

<li><a href="#lijst211">The crafting window</a></li>

<li><a href="#lijst212">Companion at work</a></li>

<li><a href="#lijst213">Assembly components / Bounded attachementsonent</a></li>

<li><a href="#lijst214">Reverse engineering</a></li>

<li><a href="#lijst215">Schematics</a></li>

<li><a href="#lijst216">The crafting skills</a></li>

</ol>

<li><a href="#lijst22">Mission skills</a></li>

<ol>

<li><a href="#lijst221">The mission window</a></li>

<li><a href="#lijst222">Companion at work</a></li>

<li><a href="#lijst223">Mission Discoveries</a></li>

<li><a href="#lijst224">The mission skills</a></li>

</ol>

<li><a href="#lijst23">Gathering skill</a></li>

<ol>

<li><a href="#lijst231">Missions</a></li>

<li><a href="#lijst232">Resource nodes</a></li>

<li><a href="#lijst233">The gathering skills</a></li>

</ol>

<li><a href="#lijst3">Companions</a></li>

<li><a href="#lijst4">Non-subscriber guide</a></li>

<ol>

<li><a href="#lijst42">Preferred players</a></li>

</ol>

<li><a href="#lijst5">Credits</a></li>

</ol>

</body>

</html>

dsonesuk · July 18, 2016

As the validator said ol element cannot be direct child of parent element ol

<ol>
        <li><a href="#lijst1">Getting Started</a></li> <!-- valid direct li child element of parent OL -->
        <ol> <!-- invalid direct OL child element of parent OL -->
              <li>....</li>
              <li>....</li>
              <li>....</li>
        </ol>
</ol>

nesting involves wrapping ol in parent li element

<ol>
    <li><a href="#lijst1">Getting Started</a> 
        <ol> <!-- valid direct ol child element OF parent LI-->
              <li>....</li>
              <li>....</li>
              <li>....</li>
        </ol>
    </li><!-- valid direct li child element of parent OL -->
</ol>

Sunamena · July 18, 2016

Thankyou very much!

This solved my problem =D

johnniewalk · September 6, 2016

If its working fine that's good..

Ingolme · September 6, 2016

If its working fine that's good..

Please try to make your contributions to the forum meaningful.

Sign In

List inside a list

Recommended Posts

Sunamena

Link to comment

Share on other sites

dsonesuk

Link to comment

Share on other sites

Sunamena

Link to comment

Share on other sites

johnniewalk

Link to comment

Share on other sites

Ingolme

Link to comment

Share on other sites

Create an account or sign in to comment

Create an account

Sign in

Browse

Activity