Как сделать адаптивный поиск в bootstrap?

Question

[Сергей Васенин]

как сделать адаптивный поиск в bootstrap что бы он уменьшался если окно браузера меньше

Comments

[campus1]

С помощью сетки, а как еще?

[Сергей Васенин]

campus1: ну добавил я его в блок указал в пикселях а толку то? не меняется

[Александр]

Сергей Васенин: не надо указывать точных значений в пикселях. Это вредит адаптивности. Обычно bootstrap сам управляет адаптивностью. Если же у вас специфический вид формы поиска, то используйте медиа-запросы CSS.

[Сергей Васенин]

Александр Рябов: хорошо спасибо а как лучше указать форму поиска в блоке col-md-x что бы она была более менее адаптивной. Указывать форму поиска в процентах ? или только через медиа запросы

[Александр]

Сергей Васенин: у вас форма поиска является обычным текстовым полем с кнопкой "Искать" рядом. Так?

Если да, то будет достаточно следующего кода:

<div class="col-sm-X col-md-x col-lg-x">
   <form name="search" action="mysearch.php">
      <input type="text" name="query" placeholder="Искать...">
      <input type="submit" value="Поиск">
   </form>
</div>

Соответственно, вместо X нужное количество колонок сетки.