css 가로 세로 중앙 정렬

css 중앙 정렬 하는법

 

1. margin 사용하기

margin은 top right bottom left순으로 원하는 만큼의 여백을 줄 수 있다.

See the Pen css 중앙정렬 by parkjiwon (@pannchat) on CodePen.

2. position absolute

position이 absolute 인경우

left를 50%로 주면

현재 자신의 width를 포함하지 않기때문에

정 가운데가 아닌 오른쪽으로 본인의 width/2 만큼 더 밀려있을 것 이다.

translateX를 사용해서 요소의 수평 이동거리를 -50% 시켜서 정가운데 위치 시킬 수 있다ㅔ