div 내부에서 가운데 정렬을 가장 효과적으로 하는 방법이 뭘까요?
본문
table 에서는
<table>
<tr>
<td align="center" valign="middle">
텍스트나 오브젝트
</td>
</tr>
</table>
테이블 크기에 상관없이 어떤것을 넣던지
아주 간단하게 상하좌우 가운데 정렬이 됬는데
div 는 개념이 조금 틀린가봐요.
텍스트나 오브젝트의 크기를 예상하여 가운데 정렬 비슷하게 할수는 있지만
아주 간단하게 div 내부에서 상하좌우 가운데 정렬을 할수는 없을까요??
text-align:center 를 주면 된다지만
이것도 안먹히는 경우가 많다고 들어서요...
고수님의 답변을 기다립니다!
항상 감사합니다^^
답변 2
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
#wrap {
width: 500px;
height: 400px;
border: 1px solid #000;
text-align: center;
display: table-cell;
vertical-align: middle;
}
</style>
</head>
<body>
<div id="wrap">
텍스트나 오브젝트
</div>
</body>
</html>
div 의 포지션 속성에 따라서 vertical-align: middle; 적용 안되는 경우가 있네요..
그냥 div 내부에 테이블을 두어서 해야할가봐요 ㅠㅠ
지금 임시방편으로
<div><table width="div넓이" height="div높이">
<tr>
<td align="center" valign="middle">
텍스트
</td>
</tr>
</table>
</div>
이렇게는 하고 있는데..
뭔가 정론이 없을까요 ㅠㅠ
답변을 작성하시기 전에 로그인 해주세요.