我似乎无法弄清楚为什么我的菜单在子下拉列表中没有正确对齐。它们显示在其父单元格的下边缘，这使得试图在它们之间导航几乎是不可能的。您必须正确地对角下拉才能获得下一个菜单。 http://imgur.com/zxWcmZf “菜单截图”
我已经在下面发布了菜单的代码，对于我所缺少的东西，任何人有什么特别之处吗？这是我第一次使用引导程序。感谢大家花时间在这方面的帮助。
<div class="navbar-wrapper">
<div class="container">
<div class="navbar">
<div class="navbar-inner">
<div class="buttons-container">
</div>
<ul class="blue nav" id="css3-menu">
<li><a href="index.php">Home</a> </li>
<li class="dropdown"><a tabindex="-1" class="dropdown-toggle_" data-toggle="dropdown"
href="">Choice 1</a>
<ul class="dropdown-menu">
<li class="dropdown-submenu"><a tabindex="-1" href="#">Choice 1a</a>
<ul class="dropdown-menu">
<li class="dropdown-submenu"><a href="#">Choice 1a1</a>
<ul class="dropdown-menu">
<li><a tabindex="-1" href="">Choice 1a1a</a></li>
<li><a tabindex="-1" href="">Choice 1a1b</a></li>
</ul>
</li>
<li class="dropdown-submenu"><a href="#">Choice 1a2</a>
<ul class="dropdown-menu">
<li><a tabindex="-1" href="">Choice 1a2a</a></li>
<li><a tabindex="-1" href="">Choice 1a2b</a></li>
</ul>
</li>
<li class="dropdown"><a href="#">Choice 1b</a> </li>
</ul>
</li>
</ul>
</li>
<li class="dropdown"><a class="dropdown-toggle_" data-toggle="dropdown" href="">Choice
2</a>
<ul class="dropdown-menu">
<li><a href="">Choice 2a</a></li>
<li><a href="">Choice 2b</a></li>
</ul>
</li>
<li class="dropdown"><a class="dropdown-toggle_" data-toggle="dropdown" href="">Choice
3</a>
<ul class="dropdown-menu">
<li><a href="">Choice 3a</a></li>
<li><a href="">Choice 3b</a></li>
</ul>
</li>
<li><a href="">Choice 4</a> </li>
<li><a href="">Choice 5</a> </li>
</ul>
</div>
</div>
</div>
</div>
编辑：对不起，我忘记了 CSS 不知道我在想什么。这是与之相关的CSS。感谢您到目前为止的输入:)
/* css3 menu */
ul#css3-menu{
width: 940px;
min-width: 940px;
margin: 0 auto;
list-style: none;
font-family: 'Open Sans', Arial, "MS Trebuchet", sans-serif;
height: 46px;
padding: 0;
}
ul#css3-menu > li{
display: block;
float: left;
-webkit-transition: background .4s linear;
-moz-transition: background .4s linear;
-ms-transition: background .4s linear;
-o-transition: background .4s linear;
transition: background .4s linear;
<!--[if IE]>
position: relative;
<![endif]-->
}
ul#css3-menu > li:first-child{
border-left: none !important;
-webkit-border-top-left-radius: 4px;
-webkit-border-bottom-left-radius: 4px;
-moz-border-radius-topleft: 4px;
-moz-border-radius-bottomleft: 4px;
-ms-border-top-left-radius: 4px;
-ms-border-bottom-left-radius: 4px;
-o-border-top-left-radius: 4px;
-o-border-bottom-left-radius: 4px;
border-top-left-radius: 4px;
border-bottom-left-radius: 4px;
}
ul#css3-menu > li:last-child{
border-right: none !important;
}
ul#css3-menu > li > a{
display: block;
padding: 15px 30px;
color: white;
text-decoration: none;
font-weight: 600;
font-weight: bold;
}
/*
ul#css3-menu > li:hover > div{
-webkit-transform: translateY(-80px);
-moz-transform: translateY(-80px);
-ms-transform: translateY(-80px);
-o-transform: translateY(-80px);
transform: translateY(-80px);
}
*/
/*visibility: visible;*/
ul#css3-menu > li > div{
-webkit-transition: -webkit-transform .2s linear;
-moz-transition: -moz-transform .2s linear;
-ms-transition: -ms-transform .2s linear;
-o-transition: -o-transform .2s linear;
transition: transform .2s linear;
text-align: center;
margin: 0 auto;
-webkit-transform: translateY(-60px);
-moz-transform: translateY(-60px);
-ms-transform: translateY(-60px);
-o-transform: translateY(-60px);
transform: translateY(-60px);
width: 37px;
height: 37px;
/*visibility: hidden;*/
margin-bottom: -37px;
z-index: -1;
<!--[if IE]>
margin-top: -60px;
<![endif]-->
}
ul#css3-menu.blue > li > div{
background: url(../img/icons-blue.png) 0 0 no-repeat;
}
.navbar-wrapper {
background: #2773AE;
background-color:#2773AE; filter: progid:DXImageTransform.Microsoft.dropShadow(color=#2773AE, offX=0, offY=0, positive=true);
box-shadow: 0 -10px 8px -10px #074979 inset, 0 10px 8px -10px #074979 inset;
-webkit-box-shadow: 0 -10px 8px -10px #074979 inset, 0 10px 8px -10px #074979 inset;
-moz-box-shadow: 0 -10px 8px -10px #074979 inset, 0 10px 8px -10px #074979 inset;
}
ul#css3-menu.blue{
background: #2773AE;
background-color:#2773AE; filter: progid:DXImageTransform.Microsoft.dropShadow(color=#2773AE, offX=0, offY=0, positive=true);
box-shadow: 0 -10px 8px -10px #074979 inset, 0 10px 8px -10px #074979 inset;
-webkit-box-shadow: 0 -10px 8px -10px #074979 inset, 0 10px 8px -10px #074979 inset;
-moz-box-shadow: 0 -10px 8px -10px #074979 inset, 0 10px 8px -10px #074979 inset;
}
ul#css3-menu.blue > li{
border-right: 1px #074979 solid;
border-left: 1px #3e92d0 solid;
height: 46px;
}
ul#css3-menu.blue > li:hover{
background: #074979;
}