HTML新行上的随机空间

Question

我已经使用网络技术工作了大约一年了，但我不知道造成这种奇怪行为的原因。

我正在制作照片分享应用。每张照片都有自己的页面，照片张贴在左上角的时间，海报的名称在新行上，右下角有一个标题。我的代码如下：

<div class="postInfo">Name goes here<br/>This is a caption</div>

以下是我的风格：

.postInfo {
    position: absolute;
    left:0;
    bottom:0;
}

当我运行页面时，海报名称和标题显示完全符合预期，但由于某种原因，标题前面有空格。我尝试过各种替代方案，包括：

<p style="padding:0;margin:0">Name goes here</p>
<p style="padding:0;margin:0">This is a caption</p>

在标题之前总是有一个空格。我完全感到困惑。有没有人知道可能导致这种情况的原因？

Answer 1

该元素从祖先继承text-align:center。很难说出发生了什么，因为只有两条线，所以我不知道那个空间来自哪里。事实证明它根本不是一个空间。