Css h3元件在移动设备中滑落

我的网页上的h3元素有问题。在桌面上看起来还可以，但在移动设备上就可以了，如下面的屏幕截图所示

h3元素位于具有以下css的div中：

.experiental-header {
     position: absolute;
     text-align: center;
     width: 100%;
 }

.experiental-header h3 {
    margin: 0 auto;
    width: 635px;
    padding: 50px;
    background: rgba(255, 255, 255, .5);;
    text-align: center;
    }

h3元素具有以下css：

.experiental-header {
     position: absolute;
     text-align: center;
     width: 100%;
 }

.experiental-header h3 {
    margin: 0 auto;
    width: 635px;
    padding: 50px;
    background: rgba(255, 255, 255, .5);;
    text-align: center;
    }

在移动设备中：

我尝试了很多方法来解决这个问题，但没有一种效果很好，我没有太多的经验来回答媒体的提问。 你能帮我一下吗？谢谢大家!

我编辑了我的问题： 现在显示ok，但文本“Experiential”在响应模式下不会改变字体大小，如附件所示：

我试过：

 font-size: 3em;

但这似乎还不够。你能给个建议吗？

---

在

实验标题h3中

以百分比应用宽度。因此，它将在快速响应环境中运行良好

.experiential头文件{
位置：绝对位置；
文本对齐：居中；
宽度：100%；
}
.经验头h3{
保证金：0自动；
宽度：30%；
填充：50px；
背景：绿色；
文本对齐：居中；
字体大小：2.9vw；
}

标题-3

检查。体验标头父类具有位置：相对和设置。体验标头h3值像素到百分比移动

宽度：635px

自

。实验标头h3

，添加

左侧：0；右：0到
。实验标题
-我已经编辑了这个问题。你能给个建议吗？文本经验性在回应模式中并没有改变他的尺寸。提前谢谢！按百分比应用字体大小。我已尝试使用字体大小：3em；，但它没有解析更新的代码段。请尝试应用如下字体大小
字体大小：2.9vw