<li>
<a href="#"><span class="icons icon_2"></span>微博</a>
<ul class="sub-menu">
<li><a href="#">新浪微博</a></li>
<li><a href="#">腾讯微博</a></li>
</ul>
</li>
</ul> CSS:
.sub-menu {display:none}
.jason-inline-list > li:hover .sub-menu{display:block}
没有美化，你自己美化一下吧。
这个推荐答案有点太不负责任了哦：）虽然现在用IE6的人，在逐渐减少，但毕竟在中国，ie6还是有一定”地位“的。首先你要分析，代码在ie6中为什么会产生右移，而在其它浏览器中没有，虽然你没有贴代码上来，但感觉有可能是IE6双边距的问题导致的，你可以自己检查一下代码，是不是对导航应用了float，且给予了同方的向margin，如果是，就是这个原因了。
解决方法，
1. 可以给元素定义 display:inline
2. 使用hack来解决这个问题，使用加下划线的方法，如：_margin-left:10px单独对IE6设置样式。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/htmlcharset=gb2312" />
<title>无标题文档</title>
<SCRIPT type=text/javascript>
var num=5
function getObj(objName){return(document.getElementById(objName))}
function tag(id){
getObj("searconrow2").innerHTML=getObj("produce"+id).innerHTML
for(var i=1i<=numi++){
if(i==id) {
getObj("changebox"+i).className="search1"
}
else{
if(i==3 || i==(id-1)){
getObj("changebox"+i).className="search3"}
else{
getObj("changebox"+i).className="search2"}
}
}
}
function loadme(){
getObj("searconrow2").innerHTML=getObj("produce1").innerHTML
}
</SCRIPT>
<style type="text/css">
#twopage{width:779pxheight:62pxmargin:0px autobackground-image:url(bannerbg.gif)overflow:hidden}
#twopage ul{width:779pxheight:62pxmargin:0pxlist-style-type:noneoverflow:hidden}
#twopage ul li{ float:leftpadding:12px 20pxheight:62pxmargin:0pxoverflow:hiddenfont-family:Arial, Helvetica, sans-seriffont-size:12pxcolor:#660099}
#searchnavi{width:389pxheight:19pxmargin:0pxpadding:0pxoverflow:hidden}
#searchnavi ul{width:389pxmargin:0pxpadding:0pxlist-style-type:noneoverflow:hidden}
#searchnavi ul li{ float:leftwidth:70pxheight:18pxcursor:handtext-align:left}
A:link{
color:#000033
text-decoration:none
}
A:visited{
color:#000033
text-decoration:none
}
A:hover{color:#FF9900
text-decoration:none
}
#searchnavi LI.search1 { margin:0pxFONT-SIZE: 12pxcolor:#000000font-weight:boldBACKGROUND: url(topbg.gif) no-repeattext-align:centerWIDTH: 70pxPADDING: 5px 0px 0px 0pxHEIGHT: 19px! important
}
#searchnavi LI.search2 { margin:0pxFONT-SIZE: 12pxcolor:#000000font-weight:boldWIDTH: 70pxPADDING: 4px 0px 0px 0pxtext-align:centerHEIGHT: 18px! important
}
#searchnavi LI.search3 { margin:0pxFONT-SIZE: 12pxcolor:#000000font-weight:boldWIDTH: 70pxPADDING: 4px 0px 0px 0pxtext-align:centerHEIGHT: 18px! important
}
.hiddenbox{
display:none
}
</style>
</head>
<body>
<div id="twopage">
<ul>
<li><table width="389" height="38" border="0" align="left" cellpadding="0" cellspacing="0">
<tr>
<td align="left"><DIV id="searchnavi">
<UL>
<LI class="search1" id="changebox1"onmouseover="javascript:tag(1)this.blur()"><a href="#">数码产品</a></LI>
<LI class="search2" id="changebox2"onmouseover="javascript:tag(2)this.blur()"><a href="#">手机配件</a></LI>
<LI class="search2" id="changebox3"onmouseover="javascript:tag(3)this.blur()"><a href="#">IPOD配件</a></LI>
<LI class="search2" id="changebox4"onmouseover="javascript:tag(4)this.blur()"><a href="#">家用电器</a></LI>
<LI class="search2" id="changebox5"onmouseover="javascript:tag(5)this.blur()"><a href="#">办公用品</a></LI>
</UL></DIV>
</td>
</tr>
<tr>
<td align="left" background="images/dibg.gif" style="padding-left:8px "><DIV id=searchcontent>
<DIV id="searconrow2"></DIV>
<DIV class="hiddenbox" id="produce1" >MD/CD读卡器 | SIM读卡器 | MP3/MP4 | 数码相机 | PSP相关产品
</DIV>
<DIV class="hiddenbox" id="produce2">手机外壳 | 屏幕保护帖 | 手机帖纸 | 手机挂链 | 手机闪光器具| 铃声壁纸
</DIV>
<DIV class="hiddenbox" id="produce3">IPOD 外壳| IPOD 保护帖 | IPOD 保护套 | IPOD 数据线 | IPOD 外设
</DIV>
<DIV class="hiddenbox" id="produce4">手机 | 电话 | 风扇 | 随身听 | 电脑 | 电视 | 自行车 | 滑冰鞋
</DIV>
<DIV class="hiddenbox" id="produce5">打印机 | HUB | 软件 | 纸张 | ERP系统
</DIV>
</DIV></td>
</tr>
</table>
</li>
</ul>
</DIV>
</body>
</html>
