Unit 1 · Stage 3

Nesting & Organizing Information

Your page already lists the Sioux and Dakota nations and the MHA and Anishinaabe nations. Now you will put a small list inside each nation so it can show its county or region as a sub-bullet. Play in the editor, or press 👀 Type it with me for a guide. (pause on a highlighted word to see what it does)

1 What you built already

Your editor starts with everything from Stage 2: a bullet list for the three Sioux and Dakota nations, a bullet list for the two MHA and Anishinaabe nations, and a numbered Quick Facts list. Look at the preview and read what is there.

💡 In this stage you will go one level deeper by placing a list inside a list item, a technique called nesting.

2 What is nesting?

Nesting means placing one HTML element inside another. You have already done this: your <li> items live inside a <ul>. Now you will put a whole new <ul> inside a single <li> so each nation can hold its own detail.

What this code means

a <ul> inside an <li>: A list that lives inside one list item. The inner list becomes a sub-bullet under that item. Think of folders inside folders: a folder can hold more folders, and an <li> can hold another <ul>.
indentation: Adding spaces so each deeper level sits further to the right. The browser does not need it, but it makes your nested code much easier to read and fix.
closing tags: The inner list must close with </ul> before the outer </li> closes, so the detail stays tucked inside its nation.

Here is the shape you are aiming for. The nation name comes first, then a small nested list holds its place:

The nesting shape

<li>Nation Name <ul><li>Place</li></ul> </li>: One nation, with its county or region nested underneath as a sub-bullet.

🎮 Try it: in the editor, pick one Sioux and Dakota <li> and, right before its </li>, add <ul><li>a county</li></ul>. Press ▶ Run and watch the sub-bullet appear.

🤔 Quick check before you go on

Putting a list inside a list item is called what? Type one word, then press Submit to unlock the next steps.

3 Nest a county into each Sioux and Dakota nation

Find your Sioux and Dakota <ul> in the editor. Give each nation a nested <ul> with one <li> for its county. Remember to close the inner </ul> before the nation's </li>.

Spirit Lake NationRamsey, Benson and Nelson Counties

Standing Rock Sioux TribeSioux and Morton Counties

Sisseton Wahpeton OyateLake Traverse Reservation, Sargent and Richland Counties

🎮 Try it: update each of the three Sioux and Dakota <li> items so it holds a nested <ul><li>County</li></ul>. Press Run and check that each county appears indented under its nation.

4 Nest a region into each MHA and Anishinaabe nation

Do the same for the MHA and Anishinaabe list. Each nation gets a nested list holding its county or region.

Three Affiliated Tribes (MHA Nation)Fort Berthold Reservation, Western ND

Turtle Mountain Band of Chippewa IndiansRolette County

🎮 Try it: update each of the two MHA and Anishinaabe <li> items so it holds a nested <ul><li>Region</li></ul>. Press Run.

5 Why structure matters

You have just built a page whose shape mirrors how the information really fits together. North Dakota has two cultural groups, each group holds several nations, and each nation sits in a county or region. Good HTML respects those real relationships.

Structure and accessibility

nested lists: When your code mirrors how information is organized, it is easier to read, easier to update, and easier for browsers to display correctly.
screen readers: Screen readers are software that reads a page aloud for people with visual impairments. Clear nesting lets them announce that a county belongs under a nation, so proper structure makes the web more welcoming for everyone.

🎮 Try it: in the preview, notice how each county sits indented under its nation. That indent is the browser showing the nesting you wrote.

6 Make it your own

Add one more detail to a nation as a second nested <li>: a website, a fun fact, or something you learned. Just add another <li> inside the same nested <ul>.

<li>Turtle Mountain Band of Chippewa Indians
  <ul>
    <li>Rolette County</li>
    <li>tmbci.org</li>
  </ul>
</li>

✓ Finish this stage

To complete Stage 3, each nation should hold a nested list with its county or region. Press Check my work when you are ready. This opens Stage 4 and lets your teacher see that you finished.

YOUR CODE

PREVIEW