<style> #wc-searchexpandbox1 { padding:10px; } #wc-searchexpandsubmit1 { border:1px solid #111111; background: #111111; padding:5px; color:#ffffff; font:14px verdana; } #wc-searchexpandinput1 { -moz-border-radius: 10px; -khtml-border-radius: 10px; -webkit-border-radius: 10px; border:1px solid #dcdcdc; background:#ffffff; padding:5px; color:#888888; font:14px verdana; transition: width 2s; -webkit-transition: width 2s; /* Safari */ -o-transition: width 2s; /* Opera*/ -moz-transition: width 2s; /* firefox*/ width:65px; } #wc-searchexpandinput1:hover { width:200px; } </style> <div id='wc-searchexpand1'> <form expr:action='data:blog.homepageUrl + "search/"' method='get' id="wc-searchexpandbox1"> <input name='search' id='wc-searchexpandinput1' onblur='if (this.value == "") {this.value = "Search this site...";}' onfocus='if (this.value == "Search this site...") {this.value = ""}' type='text' value='Search this site...'/> <input id='wc-searchexpandsubmit1' type='submit' value='Search'/> </form> </div> - See more at: http://chenkho.blogspot.com/2014/03/stylish-search-blogger.html#sthash.YYyPuMa2.dpuf