-
div 안에 텍스트를 수직중앙정렬하는 방법개발 2011. 8. 31. 15:49div 안에 텍스트를 수평중앙정렬하기 위해서는 text-align:center; 스타일을 주면 된다.
div 안에 텍스트를 수직중앙정렬을 하려면 vertical-align:middle; 스타일을 주면 될 것 같지만, 되지 않는다.
div 가 아닌 테이블의 경우 자동으로 수직으로도 정렬이 된다.
div 에서 수직으로 중앙정렬하기 위해서는 스타일에 display:table-cell; 속성을 주면 된다.
<div style="height:300px;text-align:right;display:table-cell;vertical-align:middle;">로그인 | 회원가입</div>
하지만 IE에서는 8.0 이상부터 위의 속성이 적용된다.
꼼수로는 div 의 height 값을 line-height 값과 동일하게 주면 된다.
<div style="height:300px;text-align:right;line-height:300px;">로그인 | 회원가입</div>
반응형'개발' 카테고리의 다른 글
erwin 활용옵션 (0) 2013.06.19 플래시 보안과 크로스도메인(Crossdomain.xml) (0) 2012.03.06 jsp 파일의 서버상의 디렉토리 현재위치 (0) 2011.08.23 mysql 백업시 각각의 insert 형태로 만들기 (0) 2011.06.08 Centos 아파치 설치 후 DocumentRoot 변경시 403 Forbidden Error (0) 2011.06.08