Home text and metrics lists

Lists

Lists take a variety of forms and are used to present a series of related content.

They can be used to display:

  • a list of links
  • a list of items
  • or a list of metrics

Ordered Lists

Ordered lists are used to present a series of related content in a numbered list:

  1. A list item
  2. Another list item
  3. A third list item
  4. A fourth list item

There's often a lot of paragraphs, images, and other content between list items.

Lorem ipsum dolor sit amet, conse ctetur adipiscing elit. Nulla nec odio. Aliquam quam lectus, facilisis auctor, ultrices ut, elementum vulputate, nunc. Sed adipiscing ornare risus. Morbi est est, blandit sit amet, sagittis vel, euismod vel, velit. Pellentesque egestas sem. Suspendisse commodo ullamcorper magna.

  1. elementum vulputate, nunc. Sed adipiscing ornare risus
  2. Ullamco sunt Lorem eiusmod dolore sit ea proident.
  3. Item 3
    1. Sub-item A
  4. Aliquip esse ut consequat cupidatat qui ea proident.
    1. Ullamco sunt Lorem eiusmod dolore sit ea proident.
      1. Sub-sub-item i
      2. Aliquip esse ut consequat cupidatat qui ea proident.
        1. Ullamco sunt Lorem eiusmod dolore sit ea proident.
  5. elementum vulputate, nunc. Sed adipiscing ornare risus

Unordered Lists

Lorem ipsum dolor sit amet, conse ctetur adipiscing elit. Nulla nec odio. Aliquam quam lectus, facilisis auctor, ultrices ut, elementum vulputate, nunc. Sed adipiscing ornare risus. Morbi est est, blandit sit amet, sagittis vel, euismod vel, velit. Pellentesque egestas sem. Suspendisse commodo ullamcorper magna.

  • Lists start with an item
  • And continue on
  • And on
  • Sometimes list items are really long which means that the text inside them is likely to wrap across multiple lines. This is fine, but it's important to make sure that the list items are still readable.
  • Even between other list items

Then more text

  • A list item
    • A nested list item
  • Another list item
    • A nested list item
      • A nested nested list item
        • Let's go deeper
          • I'm going to stop now
  • A third list item

Combinations

  • 1st level unordered list (ul)
    1. 2nd level ordered list (ul ol)
      • 3rd level unordered list (ul ol ul)
    2. 2nd level ordered list (ul ol)
      1. 3rd level ordered list (ul ol ol)
  • 1st level unordered list (ul)
    • 2nd level unordered list (ul ul)
      • 3rd level unordered list (ul ul ul)
    • 2nd level unordered list (ul ul)
      1. 3rd level ordered list (ul ul ol)
  1. 1st level ordered list (ol)
    1. 2nd level ordered list (ol ol)
      • 3rd level unordered list (ol ol ul)
    2. 2nd level ordered list (ol ol)
      1. 3rd level ordered list (ol ol ol)
  2. 1st level ordered list (ol)
    • 2nd level unordered list (ol ul)
      • 3rd level unordered list (ol ul ul)
    • 2nd level unordered list (ol ul)
      1. 3rd level ordered list (ol ul ol)