如何在React上应用Rem单元进行响应式设计？

Question

我正在更改rem单位以进行响应式设计（将rem用于框的宽度和高度，并更改html font-size以使其具有响应性） 这在html和css中效果很好。

但是它在React上引起问题。我使用媒体查询并减少html font-size来更改宽度和高度。

在React上，它仅适用于font-size 62.5%。 我可以增加宽度和高度，但不能将它们减小到62.5％（10px）以下。

App.css

* {
  padding:0
  margin:0px
}

html {
  font-size:6px
}

Other.css

.box1 {
   width:40rem
   height:10rem
 }