Skip to content

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

ClassDescription
shiftmargin: auto
shift:ttop
shift:lleft
shift:rright
shift:bbottom
shift:t:l:r:bmargin: 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.

Flex

Aligned Element (flex)

Grid

Aligned Element (grid)

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

Released under the MIT License