select2 alignment funktioniert nicht

Question

select2-3.5.2 funktionierte einwandfrei. Aber sobald ich auf 4.0.3 upgrade, erscheint es plötzlich auf der linken Seite der Seite. Ich benutze jquery-UI, in der Hoffnung, dass diese beiden gut zusammen spielen werden.

float: rechts; keine Auswirkungen auf select2-4.0.3 ist mit

<div style="position:absolute; top:0px; left:0px; width:100%" class="ui-widget infobar-wrapper"> 
     <div name="ibar1" id="ibar1" class="ui-widget-header infobar"> 
      <select name="themes" id="themes" style="float:right;"> <!--margin-top:-3px;--> 
       <option></option> 
       <option value="black-tie">black-tie</option> 
       <option value="trontastic">trontastic</option> 
       <option value="ui-darkness">ui-darkness</option> 
       <option value="ui-lightness">ui-lightness</option> 
      </select> 
     </div> 
    </div> 

wie ich das in JS:

$("#themes").select2({dropdownAutoWidth:true,placeholder:'Change theme'}); 

css:

.infobar { 
    height:27px; 
    font-weight:bold; 
    overflow:hidden; 
    border:0px; 
} 

Answer 1

erscheinen, aber es scheint auch die float sollte zu einem anderen Gegenstand bewegt werden.

CSS

.infobar { 
    height: 27px; 
    font-weight: bold; 
    overflow: hidden; 
    border: 0px; 
} 

.infobar .select2-container { 
    float: right; 
} 

Arbeitsbeispiel: https://jsfiddle.net/Twisty/Lq7q5xxj/