Сократить ширину поля ввода в столбце Bootstrap, не затрагивая другие элементы - PullRequest
1 голос
/ 05 апреля 2020

Два круга ввода Я хотел бы уменьшить его размер, но оставить все остальное без изменений. У него есть класс hasTimepicker, чтобы сделать что-то подобное, но с flex CSS, с которым я не очень хорошо знаком, не смог разобраться. Как бы я это сделал? Я хотел бы использовать rem как Bootstrap, но не уверен, если это необходимо или нет.

   <div class="form-row">
.
.
.
    <div class="col-auto">
            <div class="input-group mr-2">
                <!-- ko if: position() == 'Between' -->
                <input autocomplete="off" data-bind="time: { options : { defaultTime:'8:00', showPeriod: true, showLeadingZero: false} }" maxlength="8" name="StartTime" placeholder="11:00 AM" type="text" value="" id="tp1586096023489" class="hasTimepicker w-25"> 
                <div class="input-group-prepend input-group-append">
                    <span class="input-group-text">-</span>
                </div>
                <!-- /ko -->
                <!-- ko if: position() != 'On' -->
                <input autocomplete="off" data-bind="time: { options : { defaultTime:'8:00', showPeriod: true, showLeadingZero: false} }" maxlength="8" name="EndTime" placeholder="4:00 PM" type="text" value="" id="tp1586096023490" class="hasTimepicker active"> 
                <!-- /ko -->
                <!-- ko if : position() != 'On' -->
                <div class="input-group-prepend input-group-append">
                    <span class="input-group-text">on</span>
                </div>
                <!-- /ko -->
    <select id="DateString" name="DateString"><option value=""> - All Days -</option>
    <option>Fri. Feb 28, 2020</option>
    <option>Sat. Feb 29, 2020</option>
    </select>        </div>
        </div>
.
.
.
     </div>

Sho

...