백그라운드 채우는거 질문좀할게요!!!

http://cncgreen.co.kr/sub2_2.php

메뉴바 보시면 롤오버 했을때 백그라운드를 가로로 꽉채우고 싶은데 ..저렇게 밖에 안되네요..

td class="t1">
<div id="main1" style="position:relative"><!--div고정-->
<div id="menu1" class="menu1" style="left:280px; top:-20px;" onmouseout="javascript:hideLayer('menu1');" onmouseover="javascript:showLayer('menu1'); ">
<ul class="menu">
<li class="nodiv"><a href="/sub1_1.php" class="l1">C&C푸른병원 이념</a></li>
<li class="nodiv"><a href="/sub1_2.php" class="l2">연혁</a></li>
<li class="nodiv"><a href="/sub1_3.php" class="l3">인사말</a></li>
<li class="nodiv"><a href="/sub1_4.php" class="l4">협력병원 및 기관</a></li>
</ul>

</div></div></td>

이런식으로 소스를 짯어요!!..

div 두개쓴이유가 하나만쓰면 모니터 해상도에 따라서 위치가 바뀌더라구요 그래서 저렇게 썻고

css부분은

* {margin:0; padding:0; outline:0}
.menu1,.menu2,.menu3,.menu4,.menu5,.menu6,.menu7{ width:120px; border:2px solid #99cc01;
background:#fff; color:#fff; visibility : hidden; position:absolute; margin:0; text-shadow:1px 1px #888; padding:0px;
}
.manu1:hover{background:#99cc01;}
.nav {height:36px; background:#aaa; color:#fff; text-shadow:1px 1px #888; z-index:1000}
.menu a { color:#eee; text-decoration:none; width:120px; padding-top:8px}
.menu a:hover {background:#99cc01; color:#fff;}
.menu {font:10px; color:#000;}
.menu li { width:120px; z-index:1000}

이부분이에요 ㅠㅠ 백그라운드만 채우면 되는데 못하고있어요