css - 如何使下拉菜单与标题左侧对齐？

Question

如何使子菜单与标题的左侧对齐？

我试过了.dropdown-menu-left.在<ul>但它不起作用。

代码如下:

   <div class="mainMenu">
         <nav class="navbar navbar-sura" role="navigation">
            <!-- Brand and toggle get grouped for better mobile display -->
            <div class="navbar-header">
               <a href="" class="Logo-Small"></a>
               <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
               <span class="sr-only">Toggle navigation</span>
               <span class="icon-bar"></span>
               <span class="icon-bar"></span>
               <span class="icon-bar"></span>
               </button>
            </div>

            <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
               <div class="container">
                  <a href=""class="Logo"></a>
                  <ul class="nav navbar-nav navbar-right">

                     <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown">Seguros para Autos</a>

                        <ul class="dropdown-menu">
                           <li class="pruebamenu"><a href="#">Seguros para Autos</a></li>
                           <li class="pruebamenu"><a href="#">Centros de servicio</a></li>
                           <li class="pruebamenu"><a href="#">Asistencia</a></li>
                           <li class="pruebamenu"><a href="#">Te damos más</a></li>
                           <li class="pruebamenu"><a href="#">Acompañamiento satelital</a></li>
                           <li class="pruebamenu"><a href="#">Formación</a></li>
                           <li class="pruebamenu"><a href="#">Aliados</a></li>
                           <li class="pruebamenu"><a href="#">Promociones</a></li>
                        </ul>

                     </li>
                  </ul>
               </div>
            </div>
            </div>
         </nav>
   </div>

Answer 1

很难从您的屏幕截图中分辨出来，但下拉菜单可能会这样做，因为下拉菜单靠近浏览器视口(viewport)的右边缘 - Bootstrap 3 现在“智能”将工具提示和弹出窗口定位在视口(viewport)内，如果它检测到它会在浏览器的视口(viewport)之外呈现。我怀疑下拉菜单也是如此。