Markdown is a popular lightweight markup language that allows you to write using plain text format and convert it to structurally valid HTML. It offers an easy-to-read and write syntax that can be converted into HTML/XHTML and other formats.

One of the key features of markdown is the ability to create lists. You can make unordered lists with bullets and ordered lists with numbers. Moreover, markdown supports nesting one list within another, known as nested lists. This allows you to create outlines and hierarchical structures in your documents.

In this comprehensive guide, we will explore the following topics in-depth with examples:

  • How to create unordered and ordered lists in Markdown
  • Techniques for nesting an unordered list within an unordered list
  • Nesting an ordered list within an ordered list
  • Mixing ordered and unordered lists

Creating Unordered and Ordered Lists

Creating a basic unordered or ordered list in markdown is straightforward.

Unordered List

To create a bulleted unordered list, simply add dashes (-), asterisks (*), or plus signs (+) in front of line items. The following shows an unordered list with 5 items using dashes:

- Pakistan
- Iran  
- Afghanistan
- India
- China

This will output as:

  • Pakistan
  • Iran
  • Afghanistan
  • India
  • China

Ordered List

For an ordered numbered list, add line items with numbers followed by periods. The numbers don‘t have to be in order, markdown will render them sequentially.

1. Red  
4. Blue
3. Purple 
2. Orange
5. Yellow

Outputs to:

  1. Red
  2. Blue
  3. Purple
  4. Orange
  5. Yellow

Now that we know how to create basic lists, let‘s look at nesting them.

Nesting Unordered Lists

To nest an unordered list under another unordered list, simply indent it by 4 spaces or 1 tab.

Here is an example of nesting a list of capital cities under their country names:

- Pakistan
    - Islamabad
- Iran 
    - Tehran
- Afghanistan
    - Kabul

This outputs as:

  • Pakistan
    • Islamabad
  • Iran
    • Tehran
  • Afghanistan
    • Kabul

We have nested the capital cities within their respective country names, creating a hierarchical structure.

The nested items can have multiple levels like:

- Asia
    - Pakistan
        - Islamabad
            - Population: 1.2 million
    - Iran
        - Tehran

Outputs to:

  • Asia
    • Pakistan
      • Islamabad
        • Population: 1.2 million
    • Iran
      • Tehran

This demonstrates 3 levels of nested unordered lists.

Nesting Ordered Lists

The process of nesting ordered lists is similar. Simply indent the sub-items with either 4 spaces or a tab.

For example:

1. Colors
    1. Red
        1. Bright Red
        2. Dark Red 
    2. Blue
    3. Green
2. Shapes 
    1. Square

Will output as:

  1. Colors
    1. Red
      1. Bright Red
      2. Dark Red
    2. Blue
    3. Green
  2. Shapes
    1. Square

We have nested ordered lists up to 3 levels deep. The key things to ensure:

  • Properly indent the sub-items
  • Start the nested numbered items at 1. every time

This allows markdown to render them sequentially at every level.

Mixing Unordered and Ordered Lists

You can also nest an unordered list within an ordered list and vice versa.

Here is an example:

1. Frontend Languages 
    - HTML
    - CSS
    - JavaScript
2. Backend Languages
    1. Python
    2. PHP
    3. Java

Will be rendered as:

  1. Frontend Languages
    • HTML
    • CSS
    • JavaScript
  2. Backend Languages
    1. Python
    2. PHP
    3. Java

This demonstrates nesting an unordered list under an ordered one, and then nesting an ordered list under an unordered one.

This can be extended to multiple levels as well, like:

1. Web Development
    1. Frontend
        - HTML 
        - CSS
            * Preprocessors
                + SASS
                + LESS 
            * Frameworks   
    2. Backend
        - JavaScript
            1. Node.js
            2. Deno
        - Python

Outputs to:

  1. Web Development
    1. Frontend
      • HTML
      • CSS
        • Preprocessors
          • SASS
          • LESS
        • Frameworks
    2. Backend
      • JavaScript
      1. Node.js
      2. Deno
      • Python

With proper indentation, you can create complex nested structures by interchanging unordered and ordered lists.

Common Nesting Mistakes to Avoid

When creating markdown nested lists, some common mistakes can break the ordering and structure:

1. Forgetting to indent sub-items

Sub-items need to be indented, or markdown will not recognize them as part of a list.

2. Using tabs inconsistently with spaces

Align nested items either using all tabs or all 4 spaces. Mixing them can cause indentation issues.

3. Numbering all nested items starting from 1.

For ordered lists, only the top-level items should start from 1. All sub-items should follow their own sequential numbering.

4. Putting a blank line between items

Having a blank line between nested items will break the list structure.

By avoiding these mistakes, you can accurately create nested structures.

Conclusion

Nested lists allow you to organize information hierarchically when writing in markdown. You can create nested unordered lists using bullets, nested ordered lists with sequential numbering, and even mix the two types.

The key things to remember are:

  • Use 4 space indentation or 1 tab consistently for subordinate items
  • Start top level ordered items from 1. and let markdown handle numbering sub-items
  • No blank lines within the list hierarchy
  • Nest unordered and ordered lists to creation complex structures

With some practice, nesting lists becomes second nature when writing markdown. It is a very handy formatting feature for creating outlines, documentation, articles, and even coding hints with hierarchical elements.

Similar Posts