Web
[CSS] transform: translate(-50%, -50%);
top: 50%; left: 50%; transform: translate(-50%, -50%); 흔히 가운데 정렬을 할 때 많이 사용한다. 뭔가 가운데 정렬이라 하면 뭔가 저 top: 50% left: 50%만으로 될 것 같아 보였다. (잘 모르는 나의 기준으로 봤을 때) 그런데 왜 가운데 정렬을 하고자 할때 매번 translate -50%, -50%가 쓰였다. 이 부분이 이해가 바로 되지 않아서 정리한 글 left: 50%를 적용하면 부모의 크기를 기준으로 적용된다. 부모 크기의 50%지점으로 사각형이 이동한 것을 볼 수 있다. transform: translate(-50%, 0);을 적용하면 -50% : 왼쪽으로 본인의 크기의 50%만큼 이동 - 50%이 아니라 50%였다면 오른쪽으로 이동 위 사진..
