Nesting Lists

the nest is contained completely within an open and closing list item element (see Example 2-6).

Example 2-6. Nesting an Ordered List Within Another Ordered List

<ol>
<li>Beat eggs, flour, butter and sugar until creamy</li>
<li>Pour into round baking pan</li>
<li><ol>
     <li>Add the chocolate sauce, </li>
     <li>Now, add the cinnamon crunchies, </li>
     <li>Add 1 tsp nutmeg</li>
     </ol>
</li>
<li>Place in oven and bake for 40 minutes</li>
</ol>

Figure 2-6 displays the results.

You can use a variety of list types in combination when nesting, as follows:

• Ordered lists within ordered lists

• Ordered lists within numbered lists

• Numbered lists within numbered lists

• Numbered lists within ordered lists

Say you have an ordered list describing your recipe, but the added ingredients are optional rather than sequential (see Example 2-7).

Example 2-7. Combining nested list types

<ol>
<li>Beat eggs, flour, butter and sugar until creamy</li>
<li>Pour into round baking pan</li>
<li>Slowly add and swirl any one or combination of the following ingredients:
     <ul>
     <li>chocolate sauce</li>
     <li>cinnamon crunchies,</li>
     <li>1 tsp nutmeg</li>
     </ul>
</li>
<li>Place in oven and bake for 40 minutes</li>
</ol>

You'll notice right away that any nested unordered list has an open rather than solid bullet. This is typical default browser behavior. Using CSS, you can modify the numbered and bullet styles for your nested lists.

Beware: Overuse of Nests Nesting lists can be a great way to get information across to readers quickly and easily, but they can also be overused. If you have a list more than three nests deep and it's not a complex outline, you might want to rethink the approach you're taking in organizing your information.