Types

List

A list groups related content

You can do the same using shorthands.

A list item can contain an icon

You can do the same using shorthands.

Bulleted

A list can mark items with a bullet

You can also use an `ul` and `li` to render a bulleted list

Ordered

A list can be ordered numerically

You can also use an `ol` and `li` to render an ordered list

You can also manually specify a value for an ordered list using value.

Content

Item

A list item can contain a set of items

Icon

A list item can contain an icon

Image

A list can contain an image

Header

A list can contain a header

Description

A list can contain a description

Variations

Horizontal

A list can be formatted to have items appear horizontally

Inverted

A list can be inverted to appear on a dark background

Selection

A selection list formats list items as possible choices

Animated

A list can animate to set the current item apart from the list

Be sure content can fit on one line, otherwise text content will reflow when hovered.

Relaxed

A list can relax its padding to provide more negative space

Divided

A list can show divisions between content

Celled

A list can divide its items into cells

Size

A list can vary in size

Content Variations

Vertically Aligned

An element inside a list can be vertically aligned

Floated

A list, or an element inside a list can be floated left or right

This is the bottom