more위치가 빨간색 부분으로 내려와야는뎅..middle이나 bottom을 써도 내려오지않아요..

소스는 다음과 같습니다..왜 이런현상이 나오는지 설명좀해주세요..그리고 해결방법좀..

****************************************************************************************
<script language="javascript">
function show_leemocon(size){ //show_leemocon를 선언
var d1 = document.getElementById("size1"); // 탭1
var d2 = document.getElementById("size2"); // 탭2
d1.style.display = "none";
d2.style.display = "none";

switch(size){
case 1:
d1.style.display = "";
break;
case 2:
d2.style.display = "";
break;
}
}
</script>

******************************************************************************

<td valign="top"><table width="285" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="285"><div id="size1" style="display:">
<img src = "../images/main/btn_news_on.gif"><a onClick="show_leemocon(2);" style="cursor:hand"><img src ="../images/main/btn_media_off.gif"></a><? echo latest("basic", "nw1", 3, 20); ?></div>

<div id="size2" style="display:none;">
<a onClick="show_leemocon(1);" style="cursor:hand"><img src = "../images/main/btn_news_off.gif"></a><img src ="../images/main/btn_media_on.gif">
<? echo latest("basic", "ws3", 3, 20); ?></div></td>
<td width="1"></td>

<td> </td>
<td height="27" align="right" valign="top"><a href="#"><img src="../images/main/btn_more.gif" width="28" height="5" border="0" ></a></td>



</tr>
</table></td>