여러 블럭 요소를 가운데로 정렬하려면 어떻게?

マサキ君 · Post by **マサキ君** » 2005 01 13 01:01 40

예, 뭐 제목 그대로입니다만 뭐라고 질문을 드려야 좋을지 모르겠네요.

이를테면 <div> ~ </div>로 만들어진 요소나 내지는 테이블 태그로 테이블 등을 가운데로 정렬하려면 어떻게 해야 할까요?

원래는 <center> 태그로 가운데 정렬을 했었는데 이게 비표준 태그라는 것을 알고는 좌절... (사실 짐작하고는 있었습니다만)

스타일에 뭔가를 해야 할 것 같은데 align이라는 속성이 있는것도 아니고, align-text의 경우는 텍스트만 가운데로 정렬되니 도저히 방법을 모르겠네요.

답변 부탁드립니다^^

Post by **hyeonseok** » 2005 01 13 09:59 58

div.center {
width: 300px;
margin: 0 auto;
}

하시면 됩니다.

IE5 도 지원되게 하시려면...

div.center 의 상위 element 에 text-align: center 를 넣으시고 div.center 에는 text-align: left 를 넣어 주시면 됩니다.

auto 속성을 잘 쓰면 재미있는 레이아웃을 많이 만들 수 있습니다. IE 를 제외 한다면요...

マサキ君 · Post by **マサキ君** » 2005 01 13 10:47 44

음... 제가 사실 웹쪽의 문법은 아는것이 없어서 잘 모르겠네요.

div.center {
width: 300px;
margin: 0 auto;
}

라고 표시하면 div로 지정된 요소들은 가로폭이 300픽셀이 되고 여백이 상하 0픽셀, 좌우는 자동으로 맞춰진다는 것은 사실 지금 알았습니다^^. 님께서 주신 답변을 보고 집에 있는 간단한 CSS 레퍼런스를 찾아봤지요.

그런데 이 레퍼런스가 너무 간단해서-_- div.center라고 지정하면 그 다음에 어떻게 지정해야 저 스타일을 불러다 쓸 수 있는지는 모르겠네요. 그냥

div { ~~ }

라고 지정해버리면 div 태그로 만든 모든 요소가 스타일의 영향을 받게 되니

div.center { ~~ }

라고 표시한 것 같습니다만, 그걸 어떻게 써야 하는지는 잘 모르겠네요.

너무 간단한 문제만을 해결못해서 이렇게 질문드리는 것 같아 죄송스럽습니다 (__)

Post by **hyeonseok** » 2005 01 13 10:56 32

글이 너무 러프했나 보군요. 죄송합니다. 전체 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
에서 참고 하시면 됩니다.

マサキ君 · Post by **マサキ君** » 2005 01 14 00:21 22

잘 모르는 제가 질문했는데 답변해주시는 분께서 오히려 사과를 하시면 제가 민망해지잖아요^^;;;

자세한 답변 감사합니다^^

Mozilla 한국 커뮤니티

여러 블럭 요소를 가운데로 정렬하려면 어떻게?

여러 블럭 요소를 가운데로 정렬하려면 어떻게?

잘 모르겠네요-_-

답변 감사합니다^^

Who is online