Search Button using Bootstrap

Learn how-to create a search text box and button input group using the Bootstrap front-end framework.


<div class="input-group">
	<input type="text" class="form-control" placeholder="Search for...">
      <span class="input-group-btn">
        <button class="btn btn-search" type="button"><i class="fa fa-search fa-fw"></i> Search</button>


.btn-search {
	  background: #424242;
	  border-radius: 0;
	  color: #fff;
	  border-width: 1px;
	  border-style: solid;
	  border-color: #1c1c1c;
	.btn-search:link, .btn-search:visited {
	  color: #fff;
	.btn-search:active, .btn-search:hover {
	  background: #1c1c1c;
	  color: #fff;
Brandon Himpfen
Blogger. Developer. Designer. Programmer. Photographer. Traveller. Digital Marketer. Gamer.