毛刺自举子

Question

我用引导3，bootstrap table和bootstrap submenu

我有一个自举表。最重要的是，我有一个带有子菜单的按钮。 在按钮中，我有一些小故障。

奇怪的是，鼠标只能用于Annuler，Payer，Comptant和Rembourser。 付款人也是一条线。

试图调试它，但找到了解决方案。

我这里有 https://jsfiddle.net/y0pqux38/

<div id="toolbar" class="btn-group"> 
    <button class="btn btn-primary" type="button">Actions</button> 
    <button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown" data-submenu="" aria-expanded="false"> 
     <span class="caret"></span> 
    </button> 
    <ul class="dropdown-menu dropdown-menu-right"> 
     <li><a id="cancelPaymentAction" tabindex="0">Annuler</a></li> 
     <li class="divider"></li> 
     <li><a tabindex="0">Payer</a></li> 
     <li class="pull-right"><a data-payment-mode="CASH" tabindex="0">Comptant</a></li> 
     <li class="pull-right"><a data-payment-mode="DEBIT" tabindex="0">Débit</a></li> 
     <li id="creditCardPaymentAction" class="pull-right"><a data-payment-mode="CREDITCARD" tabindex="0">Carte de crédit</a></li> 
     <li class="pull-right"><a data-payment-mode="GIFTCARD" tabindex="0">Carte cadeaux</a></li> 
     <li class="pull-right"><a data-payment-mode="CHECK" tabindex="0">Chèque</a></li> 
     <li class="divider"></li> 
     <li id="refundPaymentAction"><a tabindex="0">Rembourser</a></li> 
    </ul> 
</div> 

Answer 1

自举子菜单的故障原因时pull-right一个例子。只需从所有子菜单中删除li然后一切正常。

如果你想子菜单里的物品是right aligned使用text-right代替类pull-right

检查演示HERE

HTML：

<div class="container"> 
    <div class="row"> 
    <div class="col-sm-6 centered"> 
     <div id="toolbar" class="btn-group pull-right"> 
     <button class="btn btn-primary" type="button">Actions</button> 
     <button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown" data-submenu="" aria-expanded="false"> 
     <span class="caret"></span> 
     </button> 
     <ul class="dropdown-menu dropdown-menu-right"> 
      <li><a id="cancelPaymentAction" tabindex="0">Annuler</a></li> 
      <li class="divider"></li> 
      <li><a tabindex="0">Payer</a></li> 
      <li><a data-payment-mode="CASH" tabindex="0">Comptant</a></li> 
      <li><a data-payment-mode="DEBIT" tabindex="0">Débit</a></li> 
      <li id="creditCardPaymentAction"><a data-payment-mode="CREDITCARD" tabindex="0">Carte de crédit</a></li> 
      <li><a data-payment-mode="GIFTCARD" tabindex="0">Carte cadeaux</a></li> 
      <li><a data-payment-mode="CHECK" tabindex="0">Chèque</a></li> 
      <li class="divider"></li> 
      <li id="refundPaymentAction"><a tabindex="0">Rembourser</a></li> 
     </ul> 
     </div> 
    </div> 
    </div> 
</div>