All geek questions in one place

Bootstrap: How to make the input field and button stay on the same line?

I help with the website and learn all these skills when I go. I saw similar questions, but did not find a useful solution.

In the upper right corner of the screen you can see that the search window and the button refuse to be on the same line. http://i.imgur.com/fiurnYs.png

The HTML code for the search box is as follows:

<div class="col-sm-3 col-md-3 pull-right"> <form class="navbar-form" role="search"> <div class="input-group"> <input type="text" class="form-control" placeholder="Search" name="srch-term" id="srch-term"> <div class="input-group-btn"> <button class="btn btn-default" type="submit"><i class="icon-search"> </i></button> </div> </div> </form> </div>

The CSS code looks like this: https://raw.github.com/immenselyalive/dresswithease/master/bootstrap.css

+4
source share
1 answer

You can use the supplied code block from documents as a baseline for your code.

 <div class="input-append"> <input class="span2" id="appendedInputButton" type="text"> <button class="btn" type="button">Go!</button> </div>

http://getbootstrap.com/2.3.2/base-css.html#forms (search Buttons instead of text )

+5
source

Source: https://habr.com/ru/post/1502148/

More articles:


All Articles