Javascript Css元素在mozilla中出现时形状不正确

我在Mozilla Firefox上遇到了问题，我有两个div都位于父div中的绝对位置，当我的javascript显示元素时，它在Google Chrome和Microsoft Edge中显示在彼此的顶部，但在Mozilla Firefox中它是并排显示的，我不知道为什么会发生这种情况，但这给了我一段非常艰难的时间

Html:

#listStudentDialog{
宽度：600px；
高度：400px；
背景色：白色；
边界半径：3px；
边缘顶部：120px；
左边距：50像素；
}
#对话框加载器{
显示器：flex；
身高：继承；
柔性包装：包装；
证明内容：中心；
变换：比例（1）；
过渡：所有0.35s线性；
}
.loaderInfo{
宽度：180px；
高度：180像素；
z指数：70；
边界半径：50%；
位置：绝对位置；
排名：0；
底部：0；
保证金：自动；
背景#f9f3f3；
显示器：flex；
证明内容：中心；
过渡：所有0.35s线性；
变换：比例（1）；
}
#listStudentLoader{
保证金：自动；
宽度：200px；
高度：200px；
变换：比例（1）；
-webkit转换：转换0.35s线性；
-moz变换：变换0.35s线性；
过渡：变换0.35s线性；
动画持续时间：10秒；
动画名称：无；
}

您发布的代码根本不会产生您在任何浏览器中声称的输出现在有人编辑了您的问题，我的评论看起来很愚蠢，因为没有迹象表明您在任何浏览器中声称会得到什么！！我使用的字体没有附加在这篇文章中，我不知道如何附加在这里你如何在你的网页上使用它？我用css创建了一个字体，并将其链接到我电脑中的一个字体，该字体包含要显示的svg图像