Page 1 of 1
여러 블럭 요소를 가운데로 정렬하려면 어떻게?
Posted: 2005 01 13 01:01 40
by マサキ君
예, 뭐 제목 그대로입니다만 뭐라고 질문을 드려야 좋을지 모르겠네요.
이를테면 <div> ~ </div>로 만들어진 요소나 내지는 테이블 태그로 테이블 등을 가운데로 정렬하려면 어떻게 해야 할까요?
원래는 <center> 태그로 가운데 정렬을 했었는데 이게 비표준 태그라는 것을 알고는 좌절... (사실 짐작하고는 있었습니다만)
스타일에 뭔가를 해야 할 것 같은데 align이라는 속성이 있는것도 아니고, align-text의 경우는 텍스트만 가운데로 정렬되니 도저히 방법을 모르겠네요.
답변 부탁드립니다^^
Posted: 2005 01 13 09:59 58
by hyeonseok
div.center {
width: 300px;
margin: 0 auto;
}
하시면 됩니다.
IE5 도 지원되게 하시려면...
div.center 의 상위 element 에 text-align: center 를 넣으시고 div.center 에는 text-align: left 를 넣어 주시면 됩니다.
auto 속성을 잘 쓰면 재미있는 레이아웃을 많이 만들 수 있습니다. IE 를 제외 한다면요...
잘 모르겠네요-_-
Posted: 2005 01 13 10:47 44
by マサキ君
음... 제가 사실 웹쪽의 문법은 아는것이 없어서 잘 모르겠네요.
div.center {
width: 300px;
margin: 0 auto;
}
라고 표시하면 div로 지정된 요소들은 가로폭이 300픽셀이 되고 여백이 상하 0픽셀, 좌우는 자동으로 맞춰진다는 것은 사실 지금 알았습니다^^. 님께서 주신 답변을 보고 집에 있는 간단한 CSS 레퍼런스를 찾아봤지요.
그런데 이 레퍼런스가 너무 간단해서-_- div.center라고 지정하면 그 다음에 어떻게 지정해야 저 스타일을 불러다 쓸 수 있는지는 모르겠네요. 그냥
div { ~~ }
라고 지정해버리면 div 태그로 만든 모든 요소가 스타일의 영향을 받게 되니
div.center { ~~ }
라고 표시한 것 같습니다만, 그걸 어떻게 써야 하는지는 잘 모르겠네요.
너무 간단한 문제만을 해결못해서 이렇게 질문드리는 것 같아 죄송스럽습니다 (__)
Posted: 2005 01 13 10:56 32
by hyeonseok
글이 너무 러프했나 보군요. 죄송합니다. 전체 HTML 은 이렇습니다.
Code: Select all
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=euc-kr" />
<title>Untitled Document</title>
<style type="text/css">
div.center {
width: 300px;
margin: 0 auto;
background: #eee;
}
</style>
</head>
<body>
<div class="center"> 중앙~ </div>
</body>
</html>
IE5 도 지원을 하려면...
Code: Select all
<style type="text/css">
body {
text-align: center;
}
div.center {
width: 300px;
margin: 0 auto;
background: #eee;
text-align: left;
}
</style>
이렇게 하시면 됩니다.
CSS Selector 에 대한 내용은..
http://trio.co.kr/webrefer/css2/selector.html
에서 참고 하시면 됩니다.
답변 감사합니다^^
Posted: 2005 01 14 00:21 22
by マサキ君
잘 모르는 제가 질문했는데 답변해주시는 분께서 오히려 사과를 하시면 제가 민망해지잖아요^^;;;
자세한 답변 감사합니다^^