一个手机页面的输入框，安卓上没问题，苹果上看就出问题

[kyou5478]

		.inputWrap{width:15rem;height:1.62rem;margin:0 auto;border:1px solid #fd817f;border-radius:8px;position:absolute;top:2rem;}
		.inputWrapdiv{background-size:0.7rem 0.7rem !important;height:0.77rem;color:#5a5657;float:left;font-size:0.73rem;box-sizing:border-box;text-align:right;top:-1.8rem;}
		.inputWrap>input{width:10rem;margin-left:1rem;height:1.4rem;margin-top:0.10rem;outline:none;border:0;float:left;font-size:0.53rem;color:#fd817f;}

            <div class="inputWrap">
            	<div class="inputWrapdiv"></div>
                <input type="text" placeholder="输入姓名查询座位">
                <div style="position:relative;left:2.4rem;top:0.5rem;" id="magnifying-glass"></div>
            </div>

安卓上看没问题，苹果上就出现底边线被输入框遮盖了
这是什么问题，输入框的高度已经设置的比外框要小了
求大神解答

[道先生]

高度不要设置height,，用padding:5px 0;类似的来撑开就行，看情况加上overflow: visible;he 和 outline: 0 auto;

[风中的少年]

见意使用bootstrap中的样式。。。然后稍作些改动

[浪子回头8]

input的高度太高了，调小即可，这个真没必要用bootstrap