Html 引导megamenu中的定位悬停子菜单

我正在玩yamm引导的超大菜单。我在mega菜单中添加了一个悬停菜单。它坐得不好。我希望悬停菜单与子菜单标题和插入符号对齐。它坐在下面，我想换一下。我试着在绝对位置左上自动，但那不行。 代码笔在这里：

以下是超级菜单和悬停子菜单代码：

  <header>
   <!-- Fixed navbar -->
   <nav class="navbar agmm navbar-scroll navbar-inverse navbar-fixed-top" role="navigation" id="topnavbar">
      <div class="container">
         <div class="navbar-header">
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            </button>
            <a class="navbar-brand" href="#" title="frontpage">Logo here</a>
         </div>
         <div id="navbar" class="navbar-collapse collapse">
            <!--Wayfinder.outerTpl -->
            <ul class="nav navbar-nav">
               <!-- Wayfinder.parentRowTpl -->
               <li class="first dropdown agmm-fw">
                  <a href="#" title="" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">megamenu Level 1<b class="caret"></b></a>
                  <!--Wayfinder.innerTpl -->
                  <ul class="dropdown-menu ">
                     <!-- agmm start tags -->
                     <li>
                        <div class="agmm-content">
                           <div class="row">
                              <dl class="col-sm-15 mega-menu">
                                 <!-- Wayfinder.categoryFoldersTpl -->
                                 <dt class="first"><a href="#">Microsoft Office</a></dt>
                                 <!--Wayfinder.innerTpl -->
                                 <dd class="first">
                     <li class="hover_drop_down">
                     <a href="#">Remote Desktop Services 2016<span class="caret"></span></a>    
                     <ul class="dropdown-menu" role="menu" id="office">
                     <li><a href="#">Office 2016 Home & Business</a></li>
                     <li><a href="#">Office 2016 Home & Business</a></li>
                     <li><a href="#">Office 2016 Home & Business</a></li>
                     <li><a href="#">Office 2016 Home & Business</a></li>
                     <li><a href="#">Office 2016 Home & Business</a></li>
                     </ul>
                     </li></dd>
                     <dd class="first"> <li class="hover_drop_down">
                     <a href="#">Remote Desktop Services 2016<span class="caret"></span></a>    
                     <ul class="dropdown-menu" role="menu" id="office">
                     <li><a href="#">Office 2016 Home & Business</a></li>
                     <li><a href="#">Office 2016 Home & Business</a></li>
                     <li><a href="#">Office 2016 Home & Business</a></li>
                     <li><a href="#">Office 2016 Home & Business</a></li>
                     <li><a href="#">Office 2016 Home & Business</a></li>
                     </ul>
                     </li></dd>
                     <dd class="last"> <li class="hover_drop_down">
                     <a href="#">Remote Desktop Services 2016<span class="caret"></span></a>    
                     <ul class="dropdown-menu" role="menu">
                     <li><a href="#">Office 2016 Home & Business</a></li>
                     <li><a href="#">Office 2016 Home & Business</a></li>
                     <li><a href="#">Office 2016 Home & Business</a></li>
                     <li><a href="#">Office 2016 Home & Business</a></li>
                     <li><a href="#">Office 2016 Home & Business</a></li>
                     </ul>
                     </li></dd>
                     </dl>

                     <dl class="col-sm-15 mega-menu">
                     <!-- Wayfinder.categoryFoldersTpl -->
                     <dt class="first"><a href="#">Microsoft Office</a></dt>
                     <!--Wayfinder.innerTpl -->
                     <dd class="first"><li class="hover_drop_down">
                     <a href="#">Microsoft Office 2016<span class="caret"></span></a>    
                     <ul class="dropdown-menu" role="menu">
                     <li><a href="#">Office 2016 Home & Business</a></li>
                     <li><a href="#">Office 2016 Home & Business</a></li>
                     <li><a href="#">Office 2016 Home & Business</a></li>
                     <li><a href="#">Office 2016 Home & Business</a></li>
                     <li><a href="#">Office 2016 Home & Business</a></li>
                     </ul>
                     </li></dd>
                     <dd><a href="#">Child on level 7</a></dd>
                     <dd class="last"><a href="#">Child on level 3</a></dd>
                     </dl>

                     <dl class="col-sm-15 mega-menu">
                     <!-- Wayfinder.categoryFoldersTpl -->
                     <dt class="first"><a href="#">Microsoft Office</a></dt>
                     <!--Wayfinder.innerTpl -->
                     <dd class="first"><li class="hover_drop_down">
                     <a href="#">Microsoft Office 2016<span class="caret"></span></a>    
                     <ul class="dropdown-menu" role="menu">
                     <li><a href="#">Office 2016 Home & Business</a></li>
                     <li><a href="#">Office 2016 Home & Business</a></li>
                     <li><a href="#">Office 2016 Home & Business</a></li>
                     <li><a href="#">Office 2016 Home & Business</a></li>
                     <li><a href="#">Office 2016 Home & Business</a></li>
                     </ul>
                     </li></dd>
                     <dd><a href="#">Child on level 7</a></dd>
                     <dd class="last"><a href="#">Child on level 3</a></dd>
                     </dl>
                     <dl class="col-sm-15 mega-menu">
                     <!-- Wayfinder.categoryFoldersTpl -->
                     <dt class="first"><a href="#">Microsoft Office</a></dt>
                     <!--Wayfinder.innerTpl -->
                     <dd class="first"><li class="hover_drop_down">
                     <a href="#">Microsoft Office 2016<span class="caret"></span></a>    
                     <ul class="dropdown-menu" role="menu">
                     <li><a href="#">Office 2016 Home & Business</a></li>
                     <li><a href="#">Office 2016 Home & Business</a></li>
                     <li><a href="#">Office 2016 Home & Business</a></li>
                     <li><a href="#">Office 2016 Home & Business</a></li>
                     <li><a href="#">Office 2016 Home & Business</a></li>
                     </ul>
                     </li></dd>
                     <dd><a href="#">Child on level 7</a></dd>
                     <dd class="last"><a href="#">Child on level 3</a></dd>
                     </dl>

                     <dl class="col-sm-15 mega-menu">
                     <!-- Wayfinder.categoryFoldersTpl -->
                     <dt class="first"><a href="#">Microsoft Office</a></dt>
                     <!--Wayfinder.innerTpl -->
                     <dd class="first"><li class="hover_drop_down">
                     <a href="#">Microsoft Office 2016<span class="caret"></span></a>    
                     <ul class="dropdown-menu" role="menu">
                     <li><a href="#">Office 2016 Home & Business</a></li>
                     <li><a href="#">Office 2016 Home & Business</a></li>
                     <li><a href="#">Office 2016 Home & Business</a></li>
                     <li><a href="#">Office 2016 Home & Business</a></li>
                     <li><a href="#">Office 2016 Home & Business</a></li>
                     </ul>
                     </li></dd>
                     <dd><a href="#">Child on level 7</a></dd>
                     <dd class="last"><a href="#">Child on level 3</a></dd>
                     </dl>

                     <dl class="col-sm-15 mega-menu">
                     <!-- Wayfinder.categoryFoldersTpl -->
                     <dt class="first"><a href="#">Microsoft Office</a></dt>
                     <!--Wayfinder.innerTpl -->
                     <dd class="first"><li class="hover_drop_down">
                     <a href="#">Microsoft Office 2016<span class="caret"></span></a>    
                     <ul class="dropdown-menu" role="menu">
                     <li><a href="#">Office 2016 Home & Business</a></li>
                     <li><a href="#">Office 2016 Home & Business</a></li>
                     <li><a href="#">Office 2016 Home & Business</a></li>
                     <li><a href="#">Office 2016 Home & Business</a></li>
                     <li><a href="#">Office 2016 Home & Business</a></li>
                     </ul>
                     </li></dd>
                     <dd><a href="#">Child on level 7</a></dd>
                     <dd class="last"><a href="#">Child on level 3</a></dd>
                     </dl>
                     </div>
                     </div>
                     </li>
                     <!--agmm end tags-->
                  </ul>
               </li>
               <li class=" dropdown">
                  <a href="#" title="Referanser" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
                  Standard Level 1<b class="caret"></b></a>
                  <ul class="dropdown-menu">
                     <li class="first"><a href="#">Level 2</a></li>
                     <li><a href="#">Level 2</a></li>
                     <li><a href="#">Level 2</a></li>
                     <li> <a href="#">Level 2</a></li>
                  </ul>
               </li>
            </ul>
         </div>
         <!--/.nav-collapse -->
      </div>
   </nav>
</header>

---

我打开了密码。复制粘贴在左下角的一个，粘贴在左上角的一个和另一个上面的一个

     <dd class="last"> <li class="hover_drop_down">
                 <a href="#">Remote Desktop Services 2016<span class="caret"></span></a>    
                 <ul class="dropdown-menu" role="menu">
                 <li><a href="#">Office 2016 Home & Business</a></li>
                 <li><a href="#">Office 2016 Home & Business</a></li>
                 <li><a href="#">Office 2016 Home & Business</a></li>
                 <li><a href="#">Office 2016 Home & Business</a></li>
                 <li><a href="#">Office 2016 Home & Business</a></li>
                 </ul>
                 </li></dd>

替换其他的。我想这就是你想要的

---

我发现

是您要使用的标记。而不是

事实上，我认为这更像是一个css问题。全班同学都在悬停。如果你看一下代码，就会清楚得多。看看我的答案，我尝试了我的解决方案，效果很好。如果至少你的意思是左边的下拉列表不起作用，因为它们随机打开，这是你的要求吗？不，我不知道如何解释这一点。我希望悬停菜单在大菜单中插入符号的右侧打开。鼠标悬停时，菜单应直接向右侧打开，而不是向下，而不是半向下。它需要向右并与字母顶部或插入符号垂直对齐。不完全正确。我希望鼠标悬停在megamenu（远程服务）中第一个插入符号项上时显示的悬停子菜单与thaat条目或插入符号的顶部对齐，现在当它打开时，它位于下方，距离右侧不远。哦，好的。那么这不是解决办法：P

     <dd class="last"> <li class="hover_drop_down">
                 <a href="#">Remote Desktop Services 2016<span class="caret"></span></a>    
                 <ul class="dropdown-menu" role="menu">
                 <li><a href="#">Office 2016 Home & Business</a></li>
                 <li><a href="#">Office 2016 Home & Business</a></li>
                 <li><a href="#">Office 2016 Home & Business</a></li>
                 <li><a href="#">Office 2016 Home & Business</a></li>
                 <li><a href="#">Office 2016 Home & Business</a></li>
                 </ul>
                 </li></dd>