Html 动态居中图像中的文本

我有一个容器div，其中高度和宽度设置为100%，位置是相对的。在div I内部，使用display:block和margin:auto将图像居中（图像小于div）。然后我尝试使用position:absolute，left:45%，top 82px将图像中的文本居中。垂直对齐看起来不错，但是随着文本中字符数量的增长，文本不再在中间对齐。因此，在我下面的图像中，如果文本为4个字符，文本将不再居中。有没有更好的方法来动态对齐文本

html:

101

如果您使用绝对定位将其居中，您可能希望将

左侧更改为45%至<代码>左侧：50%然后设置如下转换：

.thing_to_center_horizontal {
    top 82px;
    left: 50%;
    transform: translateX(-50%);
}

这将使它成为动态内容的中心

左：50%
将根据内容的左上角将其放在中间，然后
转换：translateX（-50%）会将其移动到内容宽度的50%（这是动态部分）左侧，使其居中

有道理吗

但可能是一个简单的
文本对齐：居中可能有效，但很难说，因为您没有发布任何代码。
如果您使用绝对定位将其居中，您可能希望将
左侧更改为45%至<代码>左侧：50%然后设置如下转换：

.thing_to_center_horizontal {
    top 82px;
    left: 50%;
    transform: translateX(-50%);
}

这将使它成为动态内容的中心

左：50%
将根据内容的左上角将其放在中间，然后
转换：translateX（-50%）会将其移动到内容宽度的50%（这是动态部分）左侧，使其居中

有道理吗

但可能是一个简单的
文本对齐：居中
可能有效，但很难说，因为您没有发布任何代码。
如果我理解您的意思，您只需将
文本对齐：居中
添加到
倒计时容器中即可

然后将
左：45%
删除到您的
。倒计时文本
如果我理解您的意思，您只需将
文本对齐：居中
添加到您的
倒计时容器

然后将
左：45%
删除到您的
。倒计时文本
请包括相关代码或小提琴。添加了相关代码我不确定在这种情况下为什么要使用图像。几行html可以重新创建该图像，然后您可以将文本精确地放置在您想要的位置。对我来说，这听起来像是个问题（更好的问题应该是“做这件事的最佳方式是什么”，而不是“我认为如果我用这种奇怪的方式做这件事最好，，，现在我该怎么做？”请包括相关代码或fiddle。添加相关代码我不知道为什么在这种情况下使用图像。几行html可以重新创建该图像，然后您可以将文本准确地放置在您想要的位置。对我来说，这听起来像一个问题（更好的问题应该是“做这件事的最佳方式是什么”而不是“我想我最好用这种奇怪的方式来做，，，现在我该怎么做？”