top :50% 가 왜 가운데로 안가는건가요?

안녕하세요 정지죤님 kindtiger입니다 :)

우리가 포지션을 주고 top:50%를 줬을때는 정가운데가 아닌 부모크기의 절반만큼 이동하고 그 이후로 등장하는 명령어입니다.

그럼 y축으로 가운데 정렬을 하려면 내 크기의 절반만큼이 다시 위로 올라가야 가운데 정렬이 됩니다.

사용하신  transform: translateY(-50%)는 내 위치를 기준으로 나의 크기의 절반만큼  반대방향(위쪽)으로 이동하겠다는 뜻입니다.

그래서 top: 50% 와 transform: translateY(-50%) 가 함께 있어야 y축으로서 정가운데를 찾을 수 있습니다 :)

더 궁금하신게 있으시면 답글 남겨주세요 ^^