ios 多个input连在一起输入值时会抖动或闪屏问题，大致代码如下

Question

<style type="text/css">
.shade{
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
bottom: 0;
background-color: #000;
opacity: .8;

}
.Tureshade{

width: 100%;
height: 100%;
background-color: #000;
opacity: .8; 
}
.pc_sign{
position: absolute;
background-color: #fff;
border-radius:3px;
height: auto;
width: 80%;
margin: 0 auto;
top: 10rem;
left: 0;
margin: 0 10%;

}
.pc_sgin-context{

height: 12rem;
display: flex;
flex-direction: column;
text-align: center;
justify-content: space-around;

}
.codeNum{

display: flex;
flex-direction: row;
width: 70%;
margin: 10px auto;
justify-content: space-between;

}
.codeNum input{

border: 1px solid #ccc;
border-radius: 2px;
flex: 1;
height: 2rem;
width: 0;
margin: 0 5px;
text-align: center;
font-size: 16px;

}

</style>
<!-- 遮罩层区域 S-->
<div class="shade">
<!-- <div class="Tureshade"></div> -->
<!-- 验证码    S-->
    <div class="pc_sign" id="code" >
        <p class="clear" alt="" src="./images/svg/close.svg">
        <img src="./images/svg/back.svg" alt="关闭" class="fl lastback">
        <img src="./images/svg/close.svg" alt="关闭" class="pc_close">
        </p>
        <div class="pc_sgin-context">
        <div class="codeCon">
            <span class="sgin-text fx3">输入验证码</span>
            <span class="numcoft">验证码不正确</span>
        </div>
            <p class="code-text">验证码已发至
                <span id="codePhone" class="codePhone">1231313213</span>
            </p>
            <button class="codeBtn" id="getCode">获取验证码</button>
            <div class="codeNum">
                <input type="text"  name="code1" id="code1" >
                <input type="text"  name="code2" id="code2" >
                <input type="text"  name="code3" id="code3" >
                <input type="text"  name="code4" id="code4" >
            </div>
        </div>
    </div>
<!-- 验证码    E-->

</div>

<!-- 遮罩层区域 E-->

四个框是input，我用苹果手机测试时，有时候输入值时会出现很快的上下拉，可以说会抖动或闪屏么，不知道怎么解决...

Answer 1

我也是，这个问题有解决的吗？可以提供一下方案？
我是iphone6的手机

Answer 2

问题定位是由 position: absolute 绝对定位导致页面在输入input框时重新定位 ，使用-webkit-transform: translateZ(0)可以解决问题

Answer 3

最后解决了吗？