搜索框 在苹果手机上光标很大

html代码：

<div class="search">
   <input type="text" placeholder="输入科室名称搜索" />
</div>

css代码

.search{
    width: 6.88rem;
    height: 0.6rem;
    box-sizing: content-box;
    margin: 0 auto 0.2rem;
    -webkit-border-radius: 0.3rem;
    -moz-border-radius: 0.3rem;
    border-radius: 0.3rem;
    background: #ffffff;
    position: relative;
}
.search input{
    display: block;
    width: 100%;
    position: absolute;
    left: 0;
    top: 0.15rem;
    line-height: 0.3rem;
    -webkit-border-radius: 0.3rem;
    -moz-border-radius: 0.3rem;
    border-radius: 0.3rem;
    text-align: left;
    font-size: 0.24rem;
    outline: none;
    background: url("../img/search.png") no-repeat 0.3rem center;
    background-size: 0.3rem 0.3rem;
    text-indent: 0.8rem;
}

原理：
input不给高度，只给line-height高度，然后通过定位保证input在div里居中

tips:
初始做法是，给input一个高度，然后设置line-height与高度一样，但是这样写，在苹果手机上，光标特别大。
后来把高度去掉，通过设置padding自动撑起来，发现字不在中间。