osyan osyan - 2 months ago 19
CSS Question

show select2 multiple selection outside searchbox

Is there any way to show select2 selected items outside search box?

what i have now:

Here is a sample fiddle:

enter image description here

But what i want:

enter image description here

.select2-search-choice{
width:100%
}
<select multiple id="e1" style="width:300px">
<option value="AL">Alabama</option>
<option value="Am">Amalapuram</option>
<option value="An">Anakapalli</option>
<option value="Ak">Akkayapalem</option>
<option value="WY">Wyoming</option>
</select>

Answer

Right now you have it set to overflow: hidden;. Take that off by inherit and then set how far from the top you want your answers to go.

http://jsfiddle.net/q2hp451y/3/

.select2-search-choice{
  width:100%
}

.select2-container-multi .select2-choices {
    overflow: inherit;
}

.select2-container-multi .select2-choices .select2-search-choice {
     top: 30px;
     width: 270px;
}