묻고답하기
이걸어찌 설명해야할지.. 테이블안에서 위아래로 정렬하기?
2004.03.03 22:47
---------------------------------
: :
---------------------------------
:■ ■: : :
:메뉴: : :
: : : :
: : 본문 : :
: : : :
: : : :
:●●: : :
---------------------------------
: :
---------------------------------
이런 형태의 레이아웃으로 홈을 만들고 있습니다.
여기에서
■■ 이부분에는 메뉴테이블의 상단에 이미지가 들어가고
메뉴라고 써진부분에는 메뉴가 들어가고
●● 이부분에는 메뉴테이블의 하단에 이미지가 들어가게 하려고 합니다.
문제는 본문의 길이가 달라지더라도
■■ 이미지부분은 테이블의 상단에, 메뉴는 ■■이미지 바로아래
●● 이미지는 테이블의 하단에 정렬이 되고자 하는데
■■ 부분과 메뉴는 위쪽으로 정렬을 시켜서 괜찮은데
●●이부분의 이미지를 하단쪽으로 정렬시킬수 없다는 겁니다
본문이 짧아지던 길어지던간에 위치가 고정된다는거죠
무슨 말인지 이해하시리라 봅니다.
전 ●● 이부분의 이미지도 테이블의 하단쪽에 항상 정렬되도록 하고싶습니다.
어떤 방법을 써야할지 모르겠네요.
도움 부탁드립니다.
-----------이건 짜놓은 테이블 태그이구요------------
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=euc-kr">
</head>
<body bgcolor="#FFFFFF" text="#000000" leftmargin="50" topmargin="10" marginwidth="0" marginheight="0">
<div align="left">
<table width="820" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="150" height="60" valign="top"> </td>
<td width="540" valign="bottom">
<div align="center"></div>
</td>
<td width="124" rowspan="3" valign="top"> </td>
</tr>
<tr>
<td height="370" valign="top" bgcolor="#FFFFFF">
<p> </p>
<p align="center">메뉴</p>
</td>
<td valign="top" bgcolor="#FFFFFF">
<div align="center">본문</div>
</td>
</tr>
<tr>
<td height="50" colspan="2"> </td>
</tr>
</table>
</div>
</body>
</html>
: :
---------------------------------
:■ ■: : :
:메뉴: : :
: : : :
: : 본문 : :
: : : :
: : : :
:●●: : :
---------------------------------
: :
---------------------------------
이런 형태의 레이아웃으로 홈을 만들고 있습니다.
여기에서
■■ 이부분에는 메뉴테이블의 상단에 이미지가 들어가고
메뉴라고 써진부분에는 메뉴가 들어가고
●● 이부분에는 메뉴테이블의 하단에 이미지가 들어가게 하려고 합니다.
문제는 본문의 길이가 달라지더라도
■■ 이미지부분은 테이블의 상단에, 메뉴는 ■■이미지 바로아래
●● 이미지는 테이블의 하단에 정렬이 되고자 하는데
■■ 부분과 메뉴는 위쪽으로 정렬을 시켜서 괜찮은데
●●이부분의 이미지를 하단쪽으로 정렬시킬수 없다는 겁니다
본문이 짧아지던 길어지던간에 위치가 고정된다는거죠
무슨 말인지 이해하시리라 봅니다.
전 ●● 이부분의 이미지도 테이블의 하단쪽에 항상 정렬되도록 하고싶습니다.
어떤 방법을 써야할지 모르겠네요.
도움 부탁드립니다.
-----------이건 짜놓은 테이블 태그이구요------------
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=euc-kr">
</head>
<body bgcolor="#FFFFFF" text="#000000" leftmargin="50" topmargin="10" marginwidth="0" marginheight="0">
<div align="left">
<table width="820" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="150" height="60" valign="top"> </td>
<td width="540" valign="bottom">
<div align="center"></div>
</td>
<td width="124" rowspan="3" valign="top"> </td>
</tr>
<tr>
<td height="370" valign="top" bgcolor="#FFFFFF">
<p> </p>
<p align="center">메뉴</p>
</td>
<td valign="top" bgcolor="#FFFFFF">
<div align="center">본문</div>
</td>
</tr>
<tr>
<td height="50" colspan="2"> </td>
</tr>
</table>
</div>
</body>
</html>
아랫셀은 하단정렬~!
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=euc-kr">
</head>
<body bgcolor="#FFFFFF" text="#000000" leftmargin="50" topmargin="10" marginwidth="0" marginheight="0">
<div align="left">
<table width="820" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="133" height="60" valign="top"> </td>
<td width="684" valign="bottom"> <div align="center"></div></td>
<td width="3" rowspan="4" valign="top"> </td>
</tr>
<tr>
<td height="1638" valign="top" bgcolor="#FFFFFF"> <p> </p>
<p align="center">메뉴<br>
여긴 상단정렬</p></td>
<td rowspan="2" valign="top" bgcolor="#FFFFFF"> <div align="center">본문</div></td>
</tr>
<tr>
<td height="50" align="center" valign="bottom" bgcolor="#FFFFFF">여긴하단정렬</td>
</tr>
<tr>
<td height="50" colspan="2"> </td>
</tr>
</table>
</div>
</body>
</html>