Editierbare Combobox für Bootstrap

Question

Ich versuche, eine editierbare Combobox mit dem folgenden Code zu erstellen, und es funktioniert gut. Das einzige Problem ist, dass das Caret-Symbol links statt rechts angezeigt wird.

<div class="input-append btn-group"> 
          <input class="span2" id="appendedInputButton" size="16" type="text" value="Error Duration"> 
          <ul class="dropdown-menu"> 
           <li>Edit</li> 
           <li>Delete</li> 
           <li>Ban</li> 
          </ul> 
          <a class="btn btn-primary dropdown-toggle" data-toggle="dropdown" href="#"> 
           <span class="caret"></span> 
          </a> 
        </div> 

Answer 1

Drei Lösungen:

1 (empfohlen):

entfernen btn-group Klasse (diese Klasse verursacht das Problem, denn jeder .btn innerhalb btn-group Block nach links und Ihre Eingabe schwebt nicht schwebte).

2:

hinzufügen pull-right Klasse zu Ihrem Anker.

<a class="btn btn-primary dropdown-toggle pull-right" data-toggle="dropdown" href="#"> 
    <span class="caret"></span> 
</a> 

3:

input { 
    float: left; 
}