如何增加下拉项的悬停宽度答案

【问题标题】：How to increase the hover width of a dropdown item如何增加下拉项的悬停宽度
【发布时间】：2019-04-04 13:44:49
【问题描述】：

我在引导导航选项卡中有一个下拉菜单。但是一个特定的下拉项只能悬停在有限的宽度上。

代码sn-p：

<ul class="page-title__nav common-list nav nav-tabs">
     <li class="dropdown">
         <a href="#" data-toggle="dropdown" class="dropdown-toggle">Inventory<b class="caret"></b></a>
               <ul class="dropdown-menu">
                   <li style="margin-left: 15px;"><a data-toggle="tab" onclick="loadCategories()">Categories</a></li><br>
                   <li><a data-toggle="tab" onclick="loadItems()">Items</a></li><br>
                   <li><a data-toggle="tab" onclick="loadModifierGroups()">Modifier Groups</a></li><br>
               </ul>
      </li>                 
</ul>

观点：

【问题讨论】：

标签： html twitter-bootstrap-3 drop-down-menu hover

【解决方案1】：

您是否尝试删除 style="margin-left: 15px;"从你的第一个元素

【讨论】：

是的。它起作用了，它只从左侧提供边距

【解决方案2】：

好的，试试这个

<ul class="page-title__nav common-list nav nav-tabs">
<li class="dropdown">
    <a href="#" data-toggle="dropdown" class="dropdown-toggle">Inventory<b class="caret"></b></a>
    <div class="dropdown-menu">
        <a data-toggle="tab" onclick="loadCategories()">Categories</a>
        <a data-toggle="tab" onclick="loadItems()">Items</a>
        <a data-toggle="tab" onclick="loadModifierGroups()">Modifier Groups</a>
    </div>
</li>
</ul>

【讨论】：