为什么容器宽度在 Chrome 和 Firefox 中呈现为不同的尺寸？ 图像样本。 Chrome：渲染宽度为681.273

FireFox：渲染宽度为685.8499

*{
  margin: 0px;
  padding: 0px;
}
div {
    font-size: 20px;
    font-family: 'Arvo';
    max-width: 824px;
    text-transform: none;
    letter-spacing: 0em;
    line-height: 1.2;
    word-break: break-word;
    width: max-content;
    height: auto;
    position: relative;
    top: 50px;
    left:20px;
    outline: red solid 1px;
    color: black;
    -webkit-font-smoothing: subpixel-antialiased;
font-smoothing: subpixel-antialiased;
}

p { 



}

  

    What are we A team? No, no, no. We're a chemical mixture that makes 
  

在两种浏览器中打开以下链接，您将看到差异。

这是一个jsfiddle

有没有办法在两个浏览器中以相同的宽度渲染？