html输入框没有四外边框线,为什么移动端的input没有左边框？

代码如下，移动端的效果是input没有左边框。

色盲测试

* {

margin: 0;

padding: 0;

}

html,body{

width: 100%;

height: 100%;

}

.container {

width: 100%;

height: 100%;

background-color: skyblue;

}

.container .test {

position: absolute;

left: 50%;

top: 50%;

transform: translate(-50%, -50%);

}

.container .test .answer-box {

width: auto;

position: absolute;

left: 50%;

transform: translateX(-50%);

}

.container .test .answer-box input{

box-sizing: border-box;

width: 70vw;

height: 10vw;

}

确认

0

但是把父盒子宽度设置大一点又能看到了，而默认的auto却不行。

我试过去掉父盒子定位，但效果还是那样。