html - Resizeable text input -


i use bootstrap in site, wan't create this.

my html code:

<form class="navbar-form navbar-left" role="search">   <div class="form-group">     <input type="text" class="form-control search-input" placeholder="search">   </div>   <button type="submit" class="btn btn-default"> 'find'</button> </form> 

how can resize input?

in tutorial specified , css code there : add part html page : demo here

<style stype='text/css'>  input[type=text].search_form { border: 1px solid #ccc; border-radius: 3px; box-shadow: inset 0 1px 2px rgba(0,0,0,0.1); width:200px; min-height: 28px; padding: 4px 20px 4px 8px; font-size: 12px; -moz-transition: .2s linear; -webkit-transition: .2s linear; transition: .2s linear; }  input[type=text]:focus.search_form { width: 400px; border-color: #51a7e8; box-shadow: inset 0 1px 2px rgba(0,0,0,0.1),0 0 5px rgba(81,167,232,0.5); outline: none;  }  </style>  <form class="navbar-form navbar-left" role="search">   <div class="form-group">     <input type="text" class="form-control search-input" placeholder="search">   </div>   <button type="submit" class="btn btn-default"> 'find'</button> </form> 

Comments

Popular posts from this blog

wordpress - (T_ENDFOREACH) php error -

Export Excel workseet into txt file using vba - (text and numbers with formulas) -

Using django-mptt to get only the categories that have items -