List

By default, classless lists have bullets and margins. To remove the bullets and margins, simply add a class of list.

I'm an unordered list.
I have bullets and a margin.

I'm an unordered list, with a class of list.
I don't have bullets or a margin.

<ul>
  <li>I'm an unordered list.</li>
  <li>I have bullets and a margin.</li>
</ul>

<ul class="list">
  <li>I'm an unordered list, with a class of <code>list</code>.</li>
  <li>I don't have bullets or a margin.</li>
</ul>

List Inline

To make a list display it’s list items inline, simply add a modifier class of list--inline.

Item
Item
Item
Item
Item

<ul class="list  list--inline">
  <li>Item</li>
  <li>Item</li>
  <li>Item</li>
  <li>Item</li>
  <li>Item</li>
</ul>

List Checked

To create a checklist, add the list--checked modifier class.

Item 1
Item 2
Item 3
Item 4
Item 5

<ul class="list  list--checked">
  <li>Item 1</li>
  <li>Item 2</li>
  <li>Item 3</li>
  <li>Item 4</li>
  <li>Item 5</li>
</ul>