Shift

The shift utility classes help manage the alignment of an element within a flex and grid container. These classes allow you to control the alignment properties easily.

CSS Classes

Class	Description
shift	margin: auto
shift:t	top
shift:l	left
shift:r	right
shift:b	bottom
shift:t:l:r:b	margin: 0

INFO

All combinations of :t, :l, :r, and :b are possible, and the order (e.g., :t:l or :l:t) does not matter.

Top Left Right Bottom

Flex

Aligned Element (flex)

Grid

Aligned Element (grid)

<div class="shift">
  Aligned Element
</div>