我有以下（简化的）HTML结构：
<table>
<tr>
<td>
<div class="PromptContainer">
<span class="Prompt">Prompt text</span>
</div>
<input type="text" name="..."/>
</td>
</tr>
</table>
和 CSS：
.PromptContainer{
width: 0;
height: 0;
position: relative;
margin: 0 auto;
}
.Prompt{
bottom: 0;
padding-left: 0;
white-space: nowrap;
position: absolute;
}
我想将跨度元素居中于输入元素。请注意，由于边缘对齐规则（.Prompt 元素可以与输入元素的任何边缘对齐），我无法更改 .PromptContainer 的大小。span 元素内的文本长度可变，可能比输入元素的宽度长。我不能使用 javascript 来执行此任务，因为在我的情况下它太无效了（大量此类元素）。
编辑：
图像可视化我所拥有的和我想要实现的可在此处获得：
编辑2： 让我描述这个问题的目的。我们正在为用更旧的技术（作为 Windows 应用程序）编写的巨型旧应用程序编写新的基于 Web 的运行时。我们已经创建了从这个应用程序的源代码到我们的新环境（ASP.NET）的转换器。这个旧应用程序中的所有控件都是绝对定位的，因此我们以相同的方式进行操作。控件（例如输入标签表）有它的位置和大小，以及与之相关的提示文本。提示文本是相对于控件定位的，所以在翻译过程中我们不知道它的绝对位置。请注意，它取决于字体设置、文本、与控件的偏移量以及附加提示的控件边缘。
我正在尝试编写一个 CSS 规则来将提示定位在正确的位置。我已经解决了几乎所有的配置，但是我在居中时遇到了很大的问题。
由于绝对定位，我不能使用非零大小的 .PromptContainer - 我只知道控制的位置，而不是 .Prompt 本身。更大的 .PromptCointainer 会向下移动整个控制。
此外，长于控件宽度的提示文本不得更改控件的大小。