移动设备上的视图宽度100％大于100％[反应]

Question

我正在尝试使用以下代码在移动设备上覆盖div的100％宽度（但不能再覆盖其他部分）：

反应代码：

  <div className="max-width-100vw">
    HELLO I AM A SENTENCE THAT IS OVERFLOWING???
  </div>

CSS代码：

.max-width-100vw {
  max-width: 100vw;
  width: 100%;
}

但是，当我查看使用chrome开发工具在移动设备上生成的内容时，我发现div占据了查看器宽度的100％以上：

有人知道为什么会这样吗，我该如何解决？作为一种技巧，我可以将width = 50％设置为，但这不会阻止它溢出，但是我正在寻找更原则的解决方案？

Answer 1

我的错误，这仅仅是因为在开发人员控制台中查看时我放大了！