How to add CSS3 Serch box to blogger blog .

How to add CSS3 Serch box to blogger blog .

Follow simple and easy step to adding this box to blogger---->>>>

* First go to your blogger Dashboard.

* Now click in design tab and edit HTML.

* Click in small box to expand your blogger Template.

* Now find this code ]] by CTRL+F key.

* Copy below code and paste before ]]

.SR .search
{
 background: #33373E;
 overflow: hidden;
 padding: 15px;
 right: 0px;
}
*html .SR .search
{
 height: 1%;
}
.SR .search form
{
 background: #60695E;
 border: 1px solid #3ac6e5;
 padding: 10px;
 width: 245px;
}
.SR .search fieldset
{
 height: 1%;
 overflow: hidden;
}
.SR .search input
{
 background: url(http://santabanta.mywapblog.com/files/search-input.png) no-repeat;
 border: none;
 color: #666;
 float: left;
 margin-right: 2px;
 padding: 5px 3px 5px 65px;
 width: 145px;
}
.SR .search button
{
 background: url(http://santabanta.mywapblog.com/files/search-button.png) no-repeat;
 border: none;
 cursor: pointer;
 float: left;
 height: 24px;
 text-indent: -1000em;
 width: 26px;
}

* Now click to save your blogger Template.

* Now go to blogger dashboard and click in design tab.

* Now you are here --->>> Page Element

* Click in add gadget which is in blog sidebar,

* When open new choose HTML/javascript from list.

* When open new blank box copy below code and paste in blank box.

  
YOUR BLOG URL HERE">
   

   
    
    
   

   
  
 

NOTE:- remove highlighted text from your blog URL ok

* Now  click to save and now you are done.

CHEERS........