谷歌浏览器input上下不对齐兼容解决办法

最近项目中，需要写一个搜索框样式（样式很简单）如下：

当写完代码，进行浏览器兼容性测试的时候，发现在谷歌浏览器下文本框和按钮没有对齐，文本框偏下一点，其他浏览器正常；样式如下：

原因：文本框高度少2像素，因为type=”text”的高度不包括border，而type=”button”包括。（别人是这么说的）

解决办法：在input的css里增加  vertical-align:middle；

HTML代码分享：

<!--搜索框-->
<div class="index_search fr">
   <form action="" method="post">
       <input type="text" placeholder="请输入搜索关键词" /><input type="submit" id="index_btn" value="" />
   </form>
</div>

CSS关键代码

.index_search{ border-radius:30px; width:195px; height:30px; border:1px solid #ccc; margin-top:40px; padding:0 0 0 12px; overflow:hidden;}
.index_search input{ border:0px; height:30px; width:153px; line-height:30px;vertical-align:middle}
.index_search #index_btn{ width:42px; background:url(../images/search_fdj.png) center center #ddd; }