Umrandungsradius wird in select2 Eingabegruppe mit Checkbox angezeigt

Question

Ich habe Stunden damit verbracht, den Grenzradius auf meinem Select2 append-Kontrollkästchen loszuwerden. Ab sofort wird das Dropdown-Menü mit einem Kontrollkästchen auf der linken Seite angezeigt. Das Problem ist, dass es einen Grenzradius zwischen den beiden Eingabegruppenelementen zu geben scheint, ähnlich dem image. Die vorgeschlagene Lösung bestand darin, dem Wrapper-Element die Eingabegruppe select2-bootstrap-prepend hinzuzufügen, die für mich nicht funktioniert.

Die HTML ist wie folgt

<div class="col-lg-3"> 
    <div class="panel-body"> 
     <b>Region</b><br> 
      <div class="input-group select2-bootstrap-prepend"> 
       <span class="input-group-addon"> 
        <input type="checkbox" checked> 
       </span> 
       <select id="select2-single-append" class=" region"> 
       </select> 
      </div> 
    </div> 
</div> 

Ansicht der laufenden Beispiel von jsfiddle

Answer 1

Sie benötigen

.select2-container--default .select2-selection--single { 
    border-radius:0 0.25rem 0.25rem 0; 
} 

sehen diese Geige https://jsfiddle.net/grassog/kLchxehz/25/ (relevante CSS am unteren Ende der css Teil)