List
The list reset provides styles and modifier classes to semantic HTML5 ordered, unordered, and definition lists.
Styles
Nested lists
If any ordered/unordered list is nested within any ordered/unordered list, it's bottom margin is removed.
Unstyled list
To unstyle an ordered/unordered list (e.g. remove it's indicators), simply add a .cwf-list--unstyled class to it.
Inline list
To make an ordered/unordered list inline (e.g. horizontal), simply add a .cwf-list--inline class to it.
Examples
Elements
The following is an example of an unordered and ordered list.
- Unordered list item 1
- Unordered list item 2
- Unordered list item 3
- Ordered list item 1
- Ordered list item 2
- Ordered list item 3
Nested
The following is an example of a nested unordered list.
- Unordered list item 1
- Unordered list item 2
- Unordered list item 3
- Nested unordered list item 1
- Nested unordered list item 2
- Nested unordered list item 3
Unstyled
The following is an example of an unstyled, unordered list.
- Unstyled, unordered list item 1
- Unstyled, unordered list item 2
- Unstyled, unordered list item 3
Inline
The following is an example of an inline, ordered list.
- Inline, ordered list item 1
- Inline, ordered list item 2
- Inline, ordered list item 3
Definition
The following is an example of a definition list.
- Term 1
- Definition 1
- Term 2
- Definition 2
- Term 3
- Definition 3