Practice: HTML Text Fundamentals

Lists

Nested List

It is perfectly ok to nest one list inside another one. You might want to have some sub-bullets sitting below a top-level bullet. Let's take the second list from our recipe example:

<ol>

   <li>Remove the skin from the garlic, and chop coarsely.</li>

   <li>Remove all the seeds and stalk from the pepper, and chop coarsely.</li>

   <li>Add all the ingredients into a food processor.</li>

   <li>Process all the ingredients into a paste.</li>

   <li>If you want a coarse "chunky" hummus, process it for a short time.</li>

   <li>If you want a smooth hummus, process it for a longer time.</li>

 </ol>

Since the last two bullets are very closely related to the one before them (they read like sub-instructions or choices that fit below that bullet), it might make sense to nest them inside their own unordered list and put that list inside the current fourth bullet. This would look like so:

<ol>

   <li>Remove the skin from the garlic, and chop coarsely.</li>

   <li>Remove all the seeds and stalk from the pepper, and chop coarsely.</li>

   <li>Add all the ingredients into a food processor.</li>

   <li>Process all the ingredients into a paste.

     <ul>

       <li>If you want a coarse "chunky" hummus, process it for a short time.</li>

       <li>If you want a smooth hummus, process it for a longer time.</li>

     </ul>

   </li>

 </ol>