2차 메뉴 간격 조정 방법에 대해 여쭤봅니다.

이미지 메뉴로 2차 메뉴는 아래처럼 화면 좌측에 세로로 뜨는 타입입니다.

       2차메뉴1

       2차메뉴2

       2차메뉴3

여기서 2차메뉴1/2/3 사이에 간격을 없애고 싶은데 잘 안돼네요.

margin:0; padding:0; 을 줬음에 불구하고 메뉴들 사이에 몇픽셀 정도 간격이 생기던데..

이 간격을 없애는 방법 없을까요?

~~~~~~~~~~~~~~~~~~~~~~<layout.html - 2차  메뉴 부분>~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

<div id="subbackground">
    <div id="submenu">
   <!--@if($menu_1st)-->
   <ul id="lnb">
   {@ $idx = 1 }
   <!--@foreach($menu_1st['list'] as $key => $val)--><!--@if($val['link'])-->
   <li <!--@if($val['selected'])-->class="on"<!--@end-->><a href="{$val['href']}" <!--@if($val['+ '+ 'open_window']=='Y')-->onclick="window.open(this.href);return false;"<{@$idx++}
   <!--@end--><!--@end-->
   </ul>
   <!--@end-->
    </div>
   </div>

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

~~~~~~~~~~~~~~~~~~~~~<css - 2차 메뉴 부분>~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

#subbackground { float:right; width:200px; height:240px; background:url(../images/subbackground.jpg) no-repeat; }
#submenu { margin-left:50px; width:140px; height:240px; }
#lnb { margin:0; padding:0; overflow:hidden; white-space:nowrap; }
#lnb li { list-style:none; white-space:nowrap; }

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~