Html “为什么？”；位置：相对“；只在Chrome中工作？

我有一张桌子，它应该水平和垂直居中。水平中心设置可以正常工作（使用“边距：0自动”），但垂直中心设置（使用“位置：相对；顶部：50%；转换：平移（-50%））仅在谷歌浏览器中有效，在Firefox、Edge和MS Explorer中无效。 我发现“transform”的工作原理和它应该的一样，但是“position:relative”并不适用于所有浏览器

#内容{
保证金：0自动；
文本对齐：居中；
字体系列：arial，无衬线；
字体大小：15磅；
位置：相对位置；
最高：50%；
-webkit转换：-webkit translateY（-50%）；
-ms转换：-ms translateY（-50%）；
-莫兹变换：-moz translateY（-50%）；
-o-转换：-o-转换（-50%）；
转化：translateY（-50%）；
z指数：0；
}
看看这个



#内容{
字体系列：arial，无衬线；
字体大小：15磅；
z指数：0；
显示器：flex；
证明内容：中心；
对齐项目：居中；
高度：100vh；
}
#内容td{}
您的问题是相对位置不允许您使用
顶部
、
右侧
等定位。所以这只是改变你的Y

将其更改为
位置：绝对取而代之


#内容{
//中心内容
保证金：0自动；
//对齐文本
文本对齐：居中；
//设置字体
字体系列：arial，无衬线；
字体大小：15磅；
//设置位置
位置：绝对位置；
顶部：50%；左侧：50%；
//转换内容
-webkit转换：-webkit转换（-50%，-50%）；
-ms转换：-ms转换（-50%，-50%）；
-moz变换：-moz变换（-50%，-50%）；
-o变换：-o变换（-50%，-50%）；
转换：翻译（-50%，-50%）；
z指数：0；
}


#内容{
显示器：flex；
证明内容：中心；
对齐项目：居中；
身高：100%；
}
html，正文{
身高：100%；
}
太简单了。我可能想到了……谢谢！