Chrome 和 Firefox 之间的 Rems 渲染方式不同

在比较 Chrome 和 Firefox 中的渲染方式时，我注意到使用 rems 时存在一个小问题。

使用以下 CSS：

html {
  font-size: 62.5%;
}

.rem-test {
  width: 50%;
  height: 20rem;
  background: red;
}

渲染的结果略有不同，Firefox 显示的框比 Chrome 中看起来短：

我可以做些什么来阻止这种情况发生吗？

这是一支笔：http://codepen.io/abbasinho/pen/WbJWNq http://codepen.io/abbasinho/pen/WbJWNq

这种情况肯定会发生，因为您的浏览器有不同的字体大小设置，您可以轻松地检查它这把叉子 http://codepen.io/anon/pen/LEmvRe你的代码笔。

alert(document.querySelector('.rem-test').scrollHeight);

如果 chrome 和 firefox 中的警报值不同，您一定要检查您的字体大小设置。