IE中的嵌套ul ul ul差距

Question

我在IE中顯示嵌套列表時出現問題，firefox顯示它完美。

我附加的截圖和代碼也。

HTML代碼：

<div class="header-boxes" id="topic-options"> 
<a id="slidertoggle" href="#">List Title</a> 
<div id="options" style="display: none;"> 
<ul> 
<li ><a href="#">Topic1</a></li> 
<li ><a href="#">Topic2</a></li> 
<li ><a href="#">List1 » </a> 
<ul > 
<li><a href="#">Topic3</a></li> 
<li><a href="#">Topic4</a></li> 
<li><a href="#">Topic5</a></li> 
</ul> 
</li> 
<li ><a href="#">Topic6</a></li> 
</ul> 
</div> 
</div> 

CSS代碼：

#topic-options { 
    width: auto; 
    z-index: 3000; 
} 

.header-boxes { 
    float: left; 
    font-family: "Trebuchet MS",Arial,sans-serif; 
    font-size: 13px; 
    height: 27px; 
    margin-right: 8px; 
} 

a#slidertoggle { 
    background: url('2downarrow.png') no-repeat scroll 95% 50% #D9E4FF; 
    border-radius: 5px 5px 5px 5px; 
    color: #3F3019; 
    display: block; 
    padding: 7px; 
    width: auto; 
    margin: 0; 
} 

a:link, body_alink { 
    color: #B35400; 
} 

a { 
    color: #B35400; 
    text-decoration: none; 
} 

#options { 
    border: 1px solid #EBE1D6; 
    border-bottom-left-radius: 5px; 
    border-bottom-right-radius: 5px; 
    display: none; 
    position: absolute; 
    width: auto; 
    z-index: 50; 
} 

ol, ul { 
    list-style: none outside none; 
    padding : 0; 
    margin : 0; 
} 

#options ul li { 
    border-bottom: 1px solid #EBE1D6; 
    background-color: #DFEFFC; 
    position: relative; 
} 

#options ul li a { 
    background-color: #DFEFFC; 
    display: block; 
    padding: 7px 10px; 
} 


#options ul ul { 
    border: 1px solid #EBE1D6; 
    border-bottom-right-radius: 5px; 
    border-top-right-radius: 5px; 
    left: 100%; 
    position: absolute; 
    top: -1px; 
    visibility: hidden; 
} 

截圖：

在Firefox代碼工作良好，精細顯示嵌套列表預期。

火狐：

Firefox http://geniusguru.in/test/moz.jpg

在IE（在IE7測試）的代碼顯示如以下圖像內裏嵌套UL有它和它的父之間的間隙。嘗試了所有的盲目東西，但沒有運氣。

IE7：

IE7 http://geniusguru.in/test/ie.JPG

請幫助我。

對不起，不張貼我的jQuery代碼

jQuery代碼：

 function getSubnav(ele) { 
     if (ele.nodeName.toLowerCase() == 'li') { 
     var subnav = $('> ul', ele); 
     return subnav.length ? subnav[0] : null; 
     } else { 
     return ele; 
     } 
    } 


$(document).ready(function(){ 

$('#slidertoggle').click(function(e){ 
e.preventDefault(); 
$('#options').show(); 
}); 

$('#options').mouseleave(function(e){ 
$('#options').hide(); 
}); 

var maxWidth = $('#topic-options').width()>$('#options').width()?$('#topic-options').width()+24:$('#options').width()+24; 

$('#topic-options').css({'width': maxWidth+'px'}); 
$('#options').css({'width': maxWidth+'px'}); 

$('#options > ul > li > ul').each(function(){ 
$(this).css({'width' : maxWidth+'px'}); 
}); 

$('#options > ul > li').hover(function(){ 

var sub = getSubnav(this); 

if(!sub) return; 
$(sub).css({'visibility' : 'visible'}); 
}, 
function(){ 

var sub = getSubnav(this); 

if(!sub) return; 
$(sub).css({'visibility' : 'hidden'}); 
}); 

}); 

感謝，
桑迪普在我結束

Answer 1

http://jsfiddle.net/TEqmH/1/

做工精細，無論是在IE7，火狐等：/