Question

好吧所以我有一个页面，标题总是根据登录的人而改变（他们的名字是页面的标题）。但是，由于名称总是不同，这意味着它需要通过文本的中心定位，以便它可以双向扩展。我不确定如何处理这个问题，但我尝试了一些事情，但由于标题的长度可变，所以没有任何建议已经淘汰。因此，为了向您提供我在代码方面的基础知识：

#profteamName{
position:absolute;
text-align:center;
top:220px;
left: 550px;
color: white;
text-shadow: 1px 1px 2px black, 0 0 1em blue, 0 0 0.2em darkblue;
text-decoration:underline;

我不反对使用相对定位。只要它会水平扩展。

（更喜欢在那里使用绝对定位的长篇故事，但我将采取我能得到的东西）

感谢你们的时间。

Answer 1

不是将div放在页面左侧，而是使用width:100%;将其拉伸到整个窗口（或页面上的容器div）。它将占据整个宽度并对齐文本 - 无论长度如何 - 在div的中间。

<强> CSS

.header {
  position:absolute;
  text-align:center;
  top:50px;
  width:100%;  /* take the width of the window or container div */
  /* rest of your code */
}

您可以使用 CodePen mockup 。

将基于变量的标题居中定位

1 个答案: