基于十进制REM的字体大小无法按预期工作

Question

好的，让我看看能不能解释一下。

如果我将body字体大小设置为16px，则下面的代码工作正常，但如果我将body font-size设置为100％则不起作用。 （即使100％等于16px）

元素“a”应该具有与body相同的字体大小，因此最有可能是16px。 元素“b”应具有10％的字体大小，元素“c”应具有30％的字体大小。

问题只出在Chrome和Vivaldi上，元素“b”和“c”似乎不希望低于6px“通过”REM，而Firefox和IE很高兴将它们降低到1或2像素它们都有效，它们都是！最终大小相同，前者为6px。

我为此使用了Chrome插件CSSViewer ......我的眼睛：P

这是一个错误吗？或者我做错了什么？我真的希望能够在Chrome和Vivaldi中使用它......

以下是示例：

html {
  font-size: 100%;
}
#a {
  font-size: 1rem;
}
#b {
  font-size: 0.1rem;
}
#c {
  font-size: 0.3rem;
}

<div id="a">
  Hello world!
</div>
<div id="b">
  Hello world!
</div>
<div id="c">
  Hello world!
</div>

Answer 1

转到您的浏览器设置。在Firefox＆＃39;例如，在标准字体大小设置旁边，您将找到＆＃34;扩展设置＆＃34;按钮。当您单击它时，您将看到（以及其他）最小字体大小＆＃34; - 在Firefox中10 px。

所以无论你做什么，只要你不改变那个设置，任何计算小于10px的文本都会以10px显示......

我想其他浏览器会有类似的设置。