Lists

Atomic classes for managing a list style properties.

Classes

🔗

Class	CSS
`.list-disc`	`list-style-type: disc;`	–
`.list-decimal`	`list-style-type: decimal;`	–
`.list-inherit`	`list-style-type: inherit;`	–
`.list-inside`	`list-style-position: inside;`	–
`.list-outside`	`list-style-position: outside;`	–

Examples

🔗

<ul class="list-disc list-inside">
  <li>Disc inside</li>
  <li>Disc inside</li>
</ul>

<ul class="list-decimal list-outside mt4">
  <li>Decimal outside</li>
  <li>Decimal outside</li>
</ul>

<ul class="list-inherit mt4">
  <li>Inherit style</li>
  <li>Inherit style</li>
</ul>

Disc inside
Disc inside

Decimal outside
Decimal outside

Inherit style
Inherit style

Customization

Override list variables:

$list-styles: disc, decimal, inherit;
$list-positions: inside, outside;