I also use select2 and Bootstrap in few projects. Select2 got its own style and applies after bootstrap. I think you'll have to play with some css margin, padding etc. You can give specific class to your select_tag for a better targeting:
<%= select_tag(:option, options_for_select([['All', 1], ['Co', 2], ['Bought', 3]] ), {class: "my-specific-class-for-select2"}) %>
EDIT: with data-live-search
<%= select_tag(:option, options_for_select([['All', 1], ['Co', 2], ['Bought', 3]] ), {class: "my-specific-class-for-select2", data:{live_search: "true"}) %>
The tag will get the data-live-search attribute. Note that the underscore (_) will become an -.
Documentation about the tags and data attributes.
EDIT2:
With some adjustments in the html and css I got this working:
application.scss
/*Solution for bootsrap styling compliance*/
a.select2-choice{
height: 35px !important;
span{
padding-top: 4px;
}
}
In the view
<div class="form-group clearfix">
<%= f.label :title %><br>
<div class="col-sm-4"><%= f.text_field :title, {class: "form-control"} %></div>
<div class="col-sm-3"><%= select_tag(:type,
options_for_select([['All', 1], ['Co', 2], ['Bought', 3], ['View', 4], ['Top API', 5]] ), {style: "width:100%;"}) %></div>
</div>
<div class="actions clearfix">
<%= f.submit :class => "btn btn-primary" %>
</div>
Hope it helps.