IT/note

css 를 이용한 가로 세로 중앙 정렬하기

TY 2011. 11. 26. 18:22



화면 한 가운데 이미지나 테이블이나 div를 놓고 싶을 때가 가끔 있다.

주로 보안상으로 로그인창만 나와야 하는 페이지들이 이러한데, position과 margin을 이용하면 될 것 같아서 해봤더니 뭐 나쁘지 않은 것 같다.

css는 다음과 같다.

position:absolute; top:50%; left:50%; width:[본인이원하는가로크기]; height:[본인이원하는세로크기]; margin-left: -[본인이 원하는 가로크기/2]; margin-top: -[본인이 원하는 세로크기/2];

이렇게 했더니 정 중앙에 잘 박히는 것 같다.