Question

所以我刚才在进行个人项目时注意到了一些奇特的东西。

如果在方向之间来回切换手机，以下代码将导致div元素在纵向模式下的位置出现问题。

div不会漂浮在屏幕底部，而是固定在div上，而div会漂浮在屏幕上方，完全不会触摸屏幕的底部。

  html {
    width: 100%;
    height: 100%;
    border-bottom: solid blue 3px; box-sizing: border-box;
  }
  div {
    width: 200px;
    height: 200px;
    position: fixed;
    bottom: 0;
    box-sizing: border-box;
    border: solid black 3px;
    background: white;
  }

<div></div>

在对这个问题进行故障排除时，我发现了以下内容：

如果将height中的html从100%更改为110%，问题将自行解决。
110%很可能不是确切的“中断”点，但是我知道{{1}的div不会触摸屏幕的底部}}设置为height之多。
正方形的尺寸没有太大关系。我已经在html，105%，10px和50px上进行了测试，如果将其设置为100px，它将完全消失，但其行为方式与我以上针对所有其他值进行了说明。

值得注意的是，我正在对此进行测试，而不是iPhone 6s，而是普通的iPhone 6。

我鼓励其他用户自己测试一下并分享您的经验！

此错误是否在其他设备上存在？在其他iOS版本中？

除了将200px中的10px增至height以外，还有什么方法可以解决此问题？

Safari iOS 12.2和12.3中的错误？

0 个答案: