引导程序。 multijs CSS修复

Question

我正在将引导程序multiselect.js与以下代码一起使用。它给出的输出如图所示。该代码有效，可以选择，但所有选项都以shown in image的形式出现在一行中。

     <select class="form-control select2" name="reciever[]" id="framework" multiple required>
                <optgroup label="ALL">
                    <option value="all-student">All Students</option>
                    <option value="all-teacher">All Teachers</option>
                </optgroup>
<optgroup label="STUDENTS">
                    <option value="student1">FIRST</option>
                    <option value="student2">SECOND</option>
                </optgroup>

                            </select>

        <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-3-typeahead/4.0.2/bootstrap3-typeahead.min.js"></script>  
      <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
    <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-multiselect/0.9.13/js/bootstrap-multiselect.js"></script>
      <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-multiselect/0.9.13/css/bootstrap-multiselect.css" />

        <script type="text/javascript">
        $(document).ready(function(){ 


            $('#framework').multiselect({
      nonSelectedText: 'Select User',
      enableFiltering: true,
      enableCaseInsensitiveFiltering: true,
       includeSelectAllOption: true,
      buttonWidth:'400px'
     });
            });
    </script>