it-roy-ru.com

Bootstrap адаптивные поля формы ввода

Я использую .input-lg, чтобы сделать поля формы большими. Я ожидаю, что при уменьшении области просмотра (менее 768 пикселей по умолчанию при загрузке) поля формы станут меньше и примут обычные настройки, но это не так. Есть идеи? Может ли бутстрап справиться с этим сценарием?

Обновление:

HTML

   <form class="form-inline" role="form">
      <div class="form-group">
         <label class="sr-only" for="searchZipcode">Zipcode</label>
         <input type="text" class="form-control input-lg input-search" id="searchZipcode" placeholder="Zipcode of home?">
      </div>
   </form>
6
TimNguyenBSM

Я думаю, что вы должны поместить свой вклад в div. класс input-xx не, скажем так, отзывчив: D

 <div class="col-xx-xx"> // change xx-xx to some accepted value like sm-4, md-10, whatever it fits you.
     <input class="input-lg">
 </div>
7
Bart Calixto

Bootstrap не может справиться с этим сценарием. Спасибо всем за комментарии и ответы.

4
TimNguyenBSM

По этой причине я обычно предпочитаю использовать contenteditable div. Вы можете применить классы начальной загрузки, чтобы адаптировать ширину. Вы можете задать ему границу, если хотите, чтобы она выглядела как ввод. Используйте textContent вместо значения для доступа к данным и используйте событие focusout вместо события change.

0
Peter Smartt