Bare List
A list without any styled view or bullets.
Inline List
A list which sits on the horizontal axis, a good one for navigation bars and inline menus.
- Item 1
- Item 2
- Item 3
Stacked List
A list which sits on the vertical axis, a good one for dropdown menus and list menus.
- Item 1
- Item 2
- Item 3
Ordered List
A simple numbered list, which can be nested to make a numbered hierarchical list.
- Item 1
- Item 2
- Item 3
- Item 4 /w Nested List
- Item 1
- Item 2
- Item 3
Definition List
A definition list with added numbers to the terms list items.
- Definition Term 1
- Definition 1
- Definition Term 2.
- Definition 1
- Definition 2
- Definition Term 3.
- Definition 1
- Definition 2
- Definition 3
Responsive Lists
Switch list types at breakpoints using the correct suffix for the type of list you need. i.e. Switch from a stacked list to inline list at BP2.
- Item 1
- Item 2
- Item 3
Spacing Items Horizontally
Using spacing utilities, apply spacing to a list either horizontally or vertically. Check spacing page for full spacing utility details.
- Item 1
- Item 2
- Item 3