SELECT2 Placeholder не показывает ⇐ CSS

[Anonymous]

У меня есть модальный добавление данных о продукте. Когда я добавляю Select2 к своему выпадению, стиль контроля формы не работает должным образом, заполнитель также не показывает. Там появляется перекрестная отметка в выбранном списке. Когда я нажимаю на эту перекрестную отметку, после этого показывает заполнитель. Я попытался удалить tabindex = "-1" < /code>, но все же такая же проблема.
, пожалуйста, см. Прикрепленные снимки. < /P>

Код: Выделить всё

 Add
Product




[b]Add Prodcut[/b]
×


@csrf


Die Num


Bundle Num

@foreach ($bundles as $item)
{{ $item->name }}

@endforeach


Cut Length




Close
Save





{{-- --- modal end --- --}}



$(document).ready(function() {

$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
}
});

$('#example2').DataTable();

$('#i_sel_bundle').select2({
dropdownParent: $("#myModal"),
placeholder: "--- select ---",
allowClear: true
});
});

My select tag without using select2 js, the design is working fine.


After adding select2 js, the select tag goes inline with the label, placeholder is not показ И в опции есть небольшой перекресток, когда я нажимаю на этот Crossmark, появляется заполнитель. src = "https://i.sstatic.net/6mvyjibm.png"/>
my form control css

Код: Выделить всё

.form-control {
height: calc(2.4rem + 2px);
border: 1px solid #444951;
background: transparent;
border-radius: 0;
color: #979a9f;
padding: 0.45rem 0.75rem;
}

Почему это так?

Подробнее здесь: https://stackoverflow.com/questions/797 ... ot-showing