搜索btn与文本text一体的设计与实现

1.

2.

3.

4.

今天要做一个如图所示的效果，于是在网上大搜一翻，看看前辈们是如何做的，做成这种效果的方法应该比较多吧，但我目前知道的是用背景图片的叠加，绝对定位等等，感觉很繁琐，不过在各个浏览器中表现的一样；经过自己的摸索，自己也摸索出来了一种方法，也许前辈们已经想出来了，可能我不知道，我做的这个在各个浏览器有一定的差异，但差异不是很大，这可能就是简单了的原因吧。

html：

	<div id="search" style=""><label>关键字搜索</label>  
	  <span style=""><input type="text" value='' id="search_txt"  class=""/><input type="button" class="" id="search_btn" value=""/>  </span>
	</div>　　

css:

#search {margin-left:20px;margin-top:10px;height:50px;}
#search span{background:white;border:1px solid gray;padding:2px;}
#search  #search_txt{border:0px;font-size:18px;width:60%;}
#search  #search_btn{background:url("/image/search.png") no-repeat; width:18px;height:19px;border:0px;vertical-align:middle;cursor:pointer;}

　　效果：火狐与ie（ie8）中的效果

谷歌与极速中的效果，不知道这个怎么解决，有待高人。