Position utilities

See Bootstrap docs
Responsive positioning
.position-{breakpoint}-{position}

Position elements when using .position-absolute
  • .top-0: sets top to 0.
  • .left-0: sets left to 0.
  • .right-0: sets right to 0.
  • .bottom-0: sets bottom to 0.
  • .center-x: centers the element on the x-axis.
  • .center-y: centers the element on the y-axis.
  • .center-xy: centers the element on the x and y axis.

.center-x, .center-y, and .center-xy are responsive, so you can easily set it at a specific breakpoint: .center-xy-md.

.top-0
.left-0
.center-xy
.top-0
.right-0
.bottom-0
.left-0
.center-y
.left-0
.center-y
.right-0
.top-0
.center-x
.bottom-0
.center-x
.bottom-0
.right-0

Relative top

For those cases when you need to make tiny changes up and down from 1 to 10 pixels. It sets position to relative and top in px.

.relative-top-(1-10) and .relative-top--(1-10) for negative values.