Column

Vertical layout with consistent gap.

Basic

Item 1

Item 2

Item 3

Base

Class	Description
`.ui-column`	Base class

Size

Class	Value
`.ui-column--xs`	xs
`.ui-column--sm`	sm
`.ui-column--md`	md
`.ui-column--lg`	lg
`.ui-column--xl`	xl

Sizes

xs gap

md gap

lg gap

xl gap

<div class="ui-column ui-column--xs">
  <div class="ui-bg-muted ui-p-1">xs gap</div>
  <div class="ui-bg-muted ui-p-1">xs gap</div>
</div>
<div class="ui-column ui-column--md">
  <div class="ui-bg-muted ui-p-1">md gap</div>
  <div class="ui-bg-muted ui-p-1">md gap</div>
</div>
<div class="ui-column ui-column--lg">
  <div class="ui-bg-muted ui-p-1">lg gap</div>
  <div class="ui-bg-muted ui-p-1">lg gap</div>
</div>
<div class="ui-column ui-column--xl">
  <div class="ui-bg-muted ui-p-1">xl gap</div>
  <div class="ui-bg-muted ui-p-1">xl gap</div>
</div>