Javascript 带有unicode符号的Firefox复选框

我正在尝试使用css和unicode符号作为样式为选择器（复选框和收音机）创建一个组件。而不是默认样式

我使用了不同的Unicode：

代码：

工作正常，但在Firefox中不行（可能在其他浏览器中也不行）

在Firefox中，这些unicode符号大小不同，非常难看。有人能帮我解决这个问题吗

在Firefox中：

代码如下：

---

这是两个CSS问题

---

当您拥有标记的绝对位置时，通常应将其包装成带有

位置：相对的标记，并且您应始终将每个实例的位置指定为
顶部：0；左：0
。您还可以使用高度为0的显示：无隐藏实际检查；使用：0将无法在不同浏览器中正常工作。这就是使复选框与不同浏览器兼容所需做的全部工作
 Firefox的问题在于
字体系列：系统ui
。相反，将这些字体系列与所有相应的回退一起使用可以正常工作：

字体系列：-苹果系统、系统用户界面、BlinkMacSystemFont、“Segoe用户界面”、Roboto、“Helvetica Neue”、Arial、无衬线字体；

工作代码如下：



可以尝试使用带有支票的投票箱吗？我现在修好了：）谢谢！然而，Firefox中的问题仍然存在。我认为这与unicode符号的大小有关：（是的，您可能应该使用web字体作为字体，在这里您还可以找到漂亮的复选框图标。设置：：before和：：after和
行高图标的
宽度和
高度也很好，以避免移位，但请记住，图标的大小是由
字体大小设置的ut图标容器应正确放置，以便W/H集使容器可预测。