毛刺自舉子

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>