line-height下的dispay:inline-block垂直居中

 

 

 

html:

<div class="search fl">
	<span class="search-box">
		<input type="text" name="keyword" autocomplete="off" class="s-input" placeHolder="Search..."/>
		<button class="s-btn">Search</button>
	</span>
　　　　 <i>&nbsp;</i><!-- 這個必不可少 -->
</div>

　　

css：

.search{height: 100px;margin-left: 20px;}
.search-box{border: 1px solid #ccc; border-radius: 5px; display: inline-block;line-height:1px;}
.s-input{width: 340px;height: 23px;padding: 8px;outline: 0;border: 0;border-radius: 5px 0 0 5px;}
.s-btn{height: 40px;border: 0;width: 70px; border-radius: 0 5px 5px 0;}