Question

我似乎无法让我的文字对齐中心。它垂直工作正常，但文本对齐似乎受某些东西的影响。

这是该项目标题（顶部主图像）中的“Autorondreis”文字：

我试图垂直和水平居中的.center-text类的h1元素：

position: relative;
top: 50%;
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
text-align: center;
display: block;
color: white;
text-shadow: 0 1px 5px grey;

有人可以看看并帮我弄清楚为什么它不是水平居中的？

Answer 1

您需要将样式for rec in resp: df = pd.DataFrame(rec[rec.keys()[0]]) df['email'] = rec.keys()[0] df['campaign'] = campaign master_df = pd.concat([master_df, df]) #precreated container添加到2个元素，例如clear:both标记为类h1，center-text标记为类nav

因此，您更新的css将如下所示

navigation-menu

Answer 2

它以父 div为中心。

尝试这样做：

body > #YourDiv
{ 
position: relative;
top: 50%;
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
text-align: center;
display: inline; <---Changed to inline
color: white; 
text-shadow: 0 1px 5px grey;
}

让我知道你取得了什么成果。

Answer 3

试试这个

将您的h1标签调整为

h1{width:100%;}

然后你的h1 class="center-text"应该是核心。

Answer 4

仅使用这些css并且它们可以正常工作，我已尝试使用我的Firefox代码检查器及其工作 -

.center-text {
    position: relative;
    top: 50%;
    left: 50%; /* added this line and changed the next four lines */
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    text-align: center;
    display: inline-block; /* changed this line */
    color: white;
    text-shadow: 0 1px 5px grey;
    clear: both;
}

文本对齐中心由于某种原因无法正常工作？

4 个答案: