Css 在导航栏中添加子菜单

如何通过CSS向右移动子菜单：

我想在导航中添加一个子菜单，当我们将子菜单悬停时，如果您查看导航，它将出现在子菜单中而不是子菜单中，请向右移动

<nav class="main-menu navbar-main-slide">
   <ul class="nav navbar-nav navbar-main">
      <li><a href="index.html">HOME</a></li>
      <li class="dropdown">
         <a data-toggle="dropdown" class="dropdown-toggle border-hover-color1" href="about.html">COMPANY <i class="fa fa-angle-down"></i></a>
         <ul class="dropdown-menu">
            <li><a href="#">Who are We?</a></li>
            <li><a href="#">What we stand for?</a></li>
            <li><a href="#">History</a></li>
            <li><a href="#">Management</a></li>
            <li><a href="#">Main Services</a></li>
            <li><a href="#">Consulting services &amp; Lab</a></li>
            <li><a href="#">Events &amp; Tradeshows</a></li>
         </ul>
      </li>
      <li class="dropdown">
         <a href="#" data-toggle="dropdown" class="dropdown-toggle border-hover-color1">Advanced Packaging <i class="fa fa-angle-down"></i></a>
         <ul class="dropdown-menu">
            <li class="dropdown-submenu">
               <a  href="#" data-toggle="dropdown" class="dropdown-toggle border-hover-color1">Rust Prevention at its Best <i class="fa fa-angle-right"></i></a>
               <ul class="dropdown-toggle dropdown-menu">
                  <li><a href="#">VCI films &amp; Bags</a></li>
                  <li><a href="#">VCI paper </a></li>
                  <li><a href="#">Inbox Desiccants</a></li>
                  <li><a href="#">Propadry container Desiccant</a></li>
                  <li><a href="#">Vacuum Barrier Bags</a></li>
                  <li><a href="#">Rust Preventive Oil</a></li>
                  <li><a href="#">Cleaning Media &amp; Solutions</a></li>
                  <li><a href="#">VCI emitters</a></li>
               </ul>
            </li>
            <li class="dropdown-submenu">
               <a href="#" data-toggle="dropdown" class="dropdown-toggle border-hover-color1">Advanced Rust Removal <i class="fa fa-angle-right"></i></a>
               <ul class="dropdown-menu">
                  <li><a href="#">Neutral Rust Remover</a></li>
                  <li><a href="#">Acidic Rust Remover</a></li>
               </ul>
            </li>
            <li class="dropdown-submenu">
               <a href="#" data-toggle="dropdown" class="dropdown-toggle border-hover-color1">Technology Driven Cleaners <i class="fa fa-angle-right"></i></a>
               <ul class="dropdown-toggle dropdown-menu">
                  <li><a href="#">Aqueous cleaners for Ferrous Metals</a></li>
                  <li><a href="#">Aqueous cleaners for Universal Metals</a></li>
                  <li><a href="#">Solvent cleaners for Universal Metals</a></li>
               </ul>
            </li>
         </ul>
      </li>
      <li class="dropdown">
         <a data-toggle="dropdown" class="dropdown-toggle border-hover-color1" href="#">Industry Centric Packaging <i class="fa fa-angle-down"></i></a>
         <ul class="dropdown-toggle dropdown-menu">
            <li class="dropdown-submenu">
               <a data-toggle="dropdown" class="dropdown-toggle border-hover-color1" href="#">Accessories <i class="fa fa-angle-right"></i></a>
               <ul class="dropdown-menu">
                  <li><a href="#">Tapes </a></li>
                  <li><a href="#">Strapping Solutions </a></li>
                  <li><a href="#">Sealing &amp; Wrapping Machines</a></li>
               </ul>
            </li>
            <li class="dropdown-submenu">
               <a data-toggle="dropdown" class="dropdown-toggle border-hover-color1" href="#">Carefully Designed Inner packaging <i class="fa fa-angle-right"></i></a>
               <ul class="dropdown-toggle dropdown-menu">
                  <li><a href="#">AIR pad</a></li>
                  <li><a href="#">Bubble wrap</a></li>
                  <li><a href="#">LDPE Bags (Stretch Film &amp; Shrink Film)</a></li>
                  <li><a href="#">Moulded Pulp packaging</a></li>
               </ul>
            </li>
            <li class="dropdown-submenu">
               <a data-toggle="dropdown" class="dropdown-toggle border-hover-color1" href="#">Power Packed Load Securing <i class="fa fa-angle-right"></i></a>
               <ul class="dropdown-toggle dropdown-menu">
                  <li><a href="#">Dunn age Bags</a></li>
                  <li><a href="#">Lashing Belts &amp; Buckles </a></li>
                  <li><a href="#">Shock absorber void guards</a></li>
                  <li><a href="#">Shock, Tilt &amp; Humidity indicators </a></li>
               </ul>
            </li>
            <li class="dropdown-submenu">
               <a data-toggle="dropdown" class="dropdown-toggle border-hover-color1" href="#">Outer Packaging <i class="fa fa-angle-right"></i></a>
               <ul class="dropdown-toggle dropdown-menu">
                  <li><a href="#">Honey Comb Boxes</a></li>
                  <li><a href="#">Corrugated Plastic Boxes</a></li>
                  <li><a href="#">Corrugated Paper Boxes</a></li>
                  <li><a href="#">Angle Board &amp; Protector</a></li>
                  <li><a href="#">Wooden &amp; Plywood Boxes</a></li>
                  <li><a href="#">Wooden ,Plywood &amp; Paper pallets</a></li>
                  <li><a href="#">SLIP SHEETS</a></li>
               </ul>
            </li>
            <li><a href="#">Heavy Machine Packaging</a></li>
            <li><a href="#">Contract Packaging</a></li>
         </ul>
      </li>
      <li class="dropdown">
         <a data-toggle="dropdown" class="dropdown-toggle border-hover-color1" href="about.html">News &amp; Media <i class="fa fa-angle-down"></i></a>
         <ul class="dropdown-menu">
            <li><a href="#">FAQ</a></li>
            <li><a href="#">Packaging Facts</a></li>
            <li><a href="#">Packaging Tips</a></li>
            <li><a href="#">Events &amp; Tradeshows</a></li>
            <li><a href="blog.html">Blogs</a></li>
         </ul>
      </li>
      <li><a href="contact.html">CONTACT US</a></li>
      <li><a class="btn_header_search" href="#"><i class="fa fa-search"></i></a></li>
   </ul>
   <div class="search-form-modal transition">
      <form class="navbar-form header_search_form">
         <i class="fa fa-times search-form_close"></i>
         <div class="form-group">
            <input type="text" class="form-control" placeholder="Search">
         </div>
         <button type="submit" class="btn btn_search customBgColor">Search</button>
      </form>
   </div>
</nav>

搜寻

share css也..我已经把你的图片拉到了问题中，这样人们可以立即看到它；这可能会帮助你对你的问题产生更多的兴趣。我还删除了代码中的一些缩进，以便在较小的屏幕上更容易查看。然而，我认为你的问题读起来令人困惑；尤其是当你说“它将出现在子菜单中而不是子菜单中”。我不明白为了改进问题的措辞你在问什么。你可能还想将你包含的HTML减少到最小，以重现你需要帮助的问题，并且，正如@LIJINSAMUEL所建议的，你应该在问题的另一个代码部分包含相关的CSS。