<分区>
我有一个菜单，其中一些元素是非下拉菜单，而另一些是。
我遇到的问题是，当其中一个下拉菜单出现时，它会将所有相邻的菜单项推过。当下拉菜单消失时，它们会返回到正常位置。
这是菜单的示例:
<ul id="ulnav">
<li id="nav1" class="dropdown">
<a><i><img src="images/dandy-white/16/pencil.png" width="16"/></i>Payments In<i>
<span class="mbullet"></span></i></a>
<ul class="dropdownmenu">
<span class="droptop"></span>
<li><a href="Advanced">Advanced</a></li>
<li><a href="Account">Account</a></li>
</ul>
</li>
<li id="nav2" class="dropdown">
<a><i><img src="images/dandy-white/16/pencil.png" width="16"/></i>Payments Out<i> <span class="mbullet"></span></i></a>
</li>
</ul>
以及相关的 CSS:
ul {
list-style:none;
padding:0;
margin:0;
}
#ulnav li, #useroptions li {
float:left;
display:block;
height:42px;
width:110px;
}
#ulnav li a, #useroptions li a {
float:none;
padding:10px;
display:block;
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
opacity:0.9;
}
在上述情况下，如果我单击“收款”，将出现下拉菜单并将“付款”推过去。
如何使顶级菜单项具有自动宽度，但在出现下拉菜单时不让它们移动？