select2添加了.select2类，你可以用css重写脚本的操作，这里我用!important设置select2为100% width，如果我不这样做，select2将有24px的宽度。
您可以使用某些原则进一步定制select2生成的其他类。

$(document).ready(function(){
$("#mySelect").select2();
});

.select2 {
width:100%!important;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.js"></script>

<div class="form-group">
   <label class="control-label col-md-3">Select structure</label>
   <div class="col-lg-5 col-md-9">
      <select class="form-control" id="mySelect" runat="server"></select>

   </div>
</div>

这对我很有效：

$('select').select2({
    width: '100%'
});

并添加CSS：

.select2-selection { overflow: hidden; }
.select2-selection__rendered { white-space: normal; word-break: break-all; }

如果需要，添加到CSS "! important"。

**溢出？**也用JS做

使用CSS宽度：100%有时会得到滚动问题，如果一些元素有溢出属性。我会建议使用js也。
添加以下js

$('select').select2({
        width: '100%'
 });

在CSS下方添加

.select2-selection { overflow: hidden; }
.select2-selection__rendered { white-space: normal; word-break: break-all; }

/* 从已给定的复制：）*/

如果你正在使用bootstrap，使用下面的样式

.form-group > .select2-container {
    width: 100% !important;
}

您不需要使用!important，只需使用max-width覆盖它，如下所示：

.select2{
    max-width: 100%;
}

尝试使用下拉父项

$('#mySelect2').select2({
  dropdownParent: $('#myModal')
});

https://select2.org/dropdown#dropdown-placement

在给定的<select>上创建新的select2后，Select2插件立即创建了.select2类<span>。
为了使这个span.select2元素具有响应性，我们可以有一些可能性，例如：
1.使用%宽度（在创建select2元素之前在原始元素上，或在select2宽度配置选项中）。
1.通过CSS覆盖（例如当我们使用@media()查询）。注意这可能会影响插件的功能或显示。
对于第二个变量，我们可以使用adjacent sibling combinator（+）和!important作为宽度值来设置select2的<span>的样式，因为通常select2的span是在<select>之后创建和插入的。
示例如下：

@media (max-width: 400px) {
  select.my-x-select + span.select2 {
    width: 200px !important;
  }
}

• • 注意：**不需要select和span元素选择器，@media是一个示例用例。

首先在select标签中添加Select2类**.select2**并使用这些CSS。

.select2-container{
        width: 100% !important;
    }
    .control-label {
        width: 100%;
    }