[Web-development (jquery)] Create Css Search Box

Create Css Search Box


<style>
#searchwrapper {
width:310px; /*follow your image's size*/
height:40px;/*follow your image's size*/
background-image:url(searchbox.jpg);
background-repeat:no-repeat; /*important*/
padding:0px;
margin:0px;
position:relative; /*important*/
}
#searchwrapper form { display:inline ; }
.searchbox {
border:0px; /*important*/
background-color:transparent; /*important*/
position:absolute; /*important*/
top:4px;
left:9px;
width:256px;
height:28px;
}
.searchbox_submit {
border:0px; /*important*/
background-color:transparent; /*important*/
position:absolute; /*important*/
top:4px;
left:265px;
width:32px;
height:28px;
}
</style>
<div>
<form action="">
<input type="text" name="s" value="" />
<input type="submit" value="" />
</form>
</div>

source : http://tutorial101.blogspot.com, http://stackoverflow.com, http://wikipedia.org