两个input，不能并排紧贴在一起，中间有空隙

两个input，不能并排紧贴在一起，中间有空隙

做搜索框布局时，发现对input标签无法紧贴在一起，中间会出现空隙

 <div class="right-content">         <form action="" class="search"><input type="text" class="search_key" value="keywords"/><input type="submit" class="btn_submit" value="Go"/></form>
</div>

.right-content{width: 260px;background: #fff;float: left;margin-left: 10px;overflow: hidden;
}form{padding: 0;margin: 0;
}.search{width: 220px;height: 40px;padding: 20px;overflow: hidden;
}.search_key{width: 120px;height: 38px;line-height: 40px;font-size: 20px;color:#ddd;border: 1px solid #ddd;padding-right: 10px;padding-left: 40px;background: url(../img/search.gif) no-repeat 5px 5px ;
}.btn_submit{width: 44px;height: 40px;background: #ddd;font-size: 20px;color: #fff;border: 0;
}

图中分别为在firebug下，选中search_key和btn_submit时，元素对应的区域范围，中间会出现对应的空隙。
本来btn_submit宽度应为48px，但是由于中间的空隙占用，如果设置为48px，会出现btn_submit下移，我也没有搞清楚为什么。
最后通过对input添加浮动，才算正常

input{float:left;
}

这时btn_submit宽度为48px