Position
.absolute
The element will not remain in the natural flow of the page. It will position itself according to the closest positioned ancestor.
.absolute-center
absolute-center is a helper, that adds the offset translations to actually center the item in a container with a fixed height. It needs .absolute
to function correctly.
.fixed
The element will not remain in the natural flow of the page. It will position itself according to the viewport. It also makes the element positioned.
.relative
The element will remain in the natural flow of the page. It also makes the element positioned.
.static
The element will remain in the natural flow of the page. It will not be positioned.
Coordinates:
Coordinates are helpers to position your elements both positively and negatively.
.top-* .bottom-* .left-* .right-*
These add a position coordinate with a modifier number equaling the REM value. Accepts:
0, 1, 2, -1, -2