[CSS] position과 transform 이용해 요소 가운데에 배치하기

{
  position: absolute; // 혹은 fixed
  left: 50%;
  transform: translateX(-50%);
}

left로 가운데에 위치시킨다. 왼쪽 위의 꼭짓점을 기준으로 가운데에 위치하게 된 것이므로 몸체를 기준으로 가운데에 위치시키기 위해서 -50% (몸체의 반만큼 왼쪽으로)를 해준다.