неверное определение бутстрэп-столбцов с входными данными kendo-ui

Question

У меня есть блок кода

    <div class="form-row mt-3">
        <div class="col-md-6">
            <label for="beginDate">Start Date</label>
            <input class="form-control" id="beginDate">
        </div>
        <div class="col-md-6">
            <label for="endDate">End Date</label>
            <input class="form-control" id="endDate">
        </div>
    </div>

Далее я определяю кендо DatePicker для этих входов

$(function () {
    $("#beginDate").kendoDatePicker();
    $("#endDate").kendoDatePicker();
});

И результат:

Я думаю, что col-6 сейчас не работает. Как я могу это исправить или я что-то делаю неправильно?

Answer 1

Надеюсь, я понял проблему, но вы ожидаете, что средства выбора даты будут иметь ширину 100%, а не предопределенную ширину.

Предполагая, что это именно тот случай, я подготовил для вас додзё, показывающее, как это сделать. https://dojo.telerik.com/osENoFAF

(я предполагаю, что вы используете загрузчик 4 в этом примере.)

Все, что я сделал, это добавил новый / обновленный класс для класса k-datepicker kendo css, чтобы установить ширину на 100%.

   <style>
    .k-datepicker{
    width:100%;
    }
  </style>