Два круга ввода Я хотел бы уменьшить его размер, но оставить все остальное без изменений. У него есть класс 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>