[absolute] transform : translate(-50%, -50%)넣는 이유

position: absolute;

top: 50%

left:50%

 

하면 부모 중 position:relative가 감싸고 있는 크기의 중앙에 위치

 

왼쪽 모서리 기준으로 가운데 정렬(장기하의 코가 중심)

 

이렇게 하면 요소의 중심이 원래 왼쪽 상단 모서리로 효과적으로 이동

 

왼쪽 모서리 기준으로 가운데 정렬(장기하의 코가 중심)

transform : translate(-50%, -50%)

 

 

 

원글

 

https://stackoverflow.com/questions/46184458/transform-translate-50-50