Drop down menu 当div中心对齐时,下拉菜单的位置位于左侧

Drop down menu 当div中心对齐时,下拉菜单的位置位于左侧,drop-down-menu,Drop Down Menu,我使用了一点javascript来创建一个下拉列表,在单击图像时显示。当前初始图像居中,但下拉列表显示在帧的左侧。。。我被难住了。非常感谢您的帮助。我的代码如下: <div align="center" class="dropdown"> <img alt="Select Your District Here" onclick="showMenu()" src="images/buttons/select_district.png" style="width:

我使用了一点javascript来创建一个下拉列表,在单击图像时显示。当前初始图像居中,但下拉列表显示在帧的左侧。。。我被难住了。非常感谢您的帮助。我的代码如下:

    <div align="center" class="dropdown">
    <img alt="Select Your District Here" onclick="showMenu()" src="images/buttons/select_district.png" style="width: 200px; height: 36px;" />
    <ul aria-labelledby="dLabel" class="dropdown-menu" id="district-dd2" onmouseout="hideMenu()" role="menu" style="display:none">
        <li>
            <a href="index.php?option=com_zoo&amp;view=frontpage&amp;layout=frontpage&amp;Itemid=512" title="Arbuckle">Arbuckle</a></li>
        <li>
            <a href="index.php?option=com_zoo&amp;view=frontpage&amp;layout=frontpage&amp;Itemid=514" title="Country Estates">Country Estates</a></li>
        <li>
            <a href="index.php?option=com_zoo&amp;view=frontpage&amp;layout=frontpage&amp;Itemid=542" title="Strawberry">Strawberry</a></li>
        <li>
            <a href="index.php?option=com_zoo&amp;view=frontpage&amp;layout=frontpage&amp;Itemid=525" title="Walnut Ranch">Walnut Ranch</a></li>
    </ul>
<script type="text/javascript">
 function showMenu(){
   document.getElementById("district-dd2").style.display="block";
 }
 function hideMenu(){
   document.getElementById("district-dd2").style.display="none";
 }
</script></div>

编辑2:更多CSS-在搜索了我所有的CSS文件后,所有对下拉列表的引用似乎都在bootstrap.CSS中。我在这里把CSS作为一个txt文件发布,而不是在这里全部发布(可能会很长):

请,发布
下拉菜单的CSS
应该想到这一点。。。对不起,尼基塔!忘记提到div中的
下拉列表
。。。你能补充一下吗?问题似乎出在某个父样式中。创建你发布的这个块给了我一个很好的居中对齐……而你给我的部分只用于设置链接的格式。这将有助于查看所有适用于您发布的html的css。嗯,看起来还有一个问题。。。我可以在第一个li项上成功地悬停/单击,但当我尝试悬停在除第一个以外的任何子项上时,ul块将完全消失。它的特别奇怪。看着尼基塔,交叉着手指
.dropdown-menu > li > a {
    clear: both;
    color: #333333;
    display: block;
    font-weight: normal;
    line-height: 20px;
    padding: 3px 20px;
    white-space: nowrap;
}