CSS:
#divMainMenu ul {
list-style-type: none;
padding: 5px 0;
height:400px;
}
#divMainMenu li {
height: 17px;
margin: 3px 0;
padding: 14px 2px;
border: 1px solid #eee7cb;
background: url(../../Images/50pTransparent-20x20.png) repeat;
}
#divMainMenu li ul{
display: none;
}
html和脚本:
<script type="text/javascript">
function Show(pObj)
{
pObj = document.getElementById(pObj).id;
if (document.getElementById(pObj).style.display=='none')
document.getElementById(pObj).style.display='block';
else
document.getElementById(pObj).style.display='none';
}
</script>
<div id="divSidePanel">
<div id="divMainMenu">
<ul>
<li onclick="Show('Buyers')">Buyers
<ul id="Buyers" style="display:none;">
<li>Search</li>
<li>Submit request</li>
<li>Send message to owner</li>
</ul>
</li>
<li>Sellers</li>
<li>Contact Us</li>
</ul>
</div>
</div>
问题:当我点击文本Buyers时,它会显示子/嵌套列表。但是,其他项目不会为嵌套列表腾出空间。因此嵌套列表覆盖了主列表的空间。
这是我的代码的问题还是它的标准工作方式?有没有办法让其他项目“下推”为嵌套项目让路?
谢谢!