포지셔닝상의 좌표는 .top-#, .bottom-#(수직 위치) 및 .start-#, .end-#(수평 위치)으로 줄 수 있는데, #은 가장자리로부터 % 지점이다. 나아가, .translate-middle 클래스를 추가하면; 요소를 절대 중앙(translateX(-50%) & translateY(-50%))에 위치시키며, .translate-middle-x/y는 x/y 어느 한 방향으로 절대 중앙에 위치시킨다:

top-0 start-0
top-0 start-50 translate-middle-x
top-0 end-0
top-50 start-0 translate-middle-y
top-50 start-50 translate-middle
top-50 end-0 translate-middle-y
bottom-0 start-0
bottom-0 start-50 translate-middle-x
bottom-0 end-0