Html CSS没有正确居中

我在尝试将我的div class=内容放在单词freedom的右下角时遇到了一些麻烦。有什么帮助吗？我这里也提供了一张图片

HTML

[  / 
/
/
] 
CSS
```#埃因茨
{
文本对齐：居中；
字体大小：正常；
字体系列：“信使”，无衬线；
文本阴影：1px 1px 1px rgba（0,0,0100），1px 1px 1px rgba（0,0,0100）；
保证金：0自动；
z指数：1；
字体大小：12px；
}

id

是唯一的

不要使用

id

来控制样式，而是使用

class

，

id

通常用于处理数据

[
]

.center{text align:center；}

在CodePen演示之后，您必须将自由文本和链接放入包装器中，然后将包装器居中，以保持对文本和链接的尊重。此外，由于您希望链接到自由文本的右下角，因此链接也必须放在包装器中。由于您需要两个不同级别的链接，我建议使用块强制换行，而不是

。当元素有一个可以更改的类时，还应该避免使用

style

属性。您也不应该多次使用类似的

id

属性，您应该参考使用类

/*临时代码以避免视图被遮挡*/
正文{背景：粉红色}
#自由包装{
位置：绝对位置；
最高：50%；
左：50%；
利润上限：-50px；
左边距：-220px；
}
#自由链接包装器{
浮动：对；
}
.自由链接{
颜色：rgb（255、255、255）；
字体大小：正常；
字体大小：12px；
字体系列：“信使”，无衬线；
文本对齐：居中；
文本阴影：1px 1px 1px rgba（0,0,0100），
1px 1px 1px rgba（0,0,0100）；
线高：18px；
z指数：1；
}
.小故障{
颜色：白色；
字体大小：100px；
z指数：1；
}
/*旧代码*/
@关键帧噪波动画{
0% {
剪辑路径：插入（87%04%0）；
}
5% {
剪辑路径：插入（3%0 43%0）；
}
10% {
剪辑路径：插入（82%04%0）；
}
15% {
剪辑路径：插入（41%02%0）；
}
20% {
剪辑路径：插入（96%05%0）；
}
25% {
剪辑路径：插入（57%0 35%0）；
}
30% {
剪辑路径：插入（78%04%0）；
}
35% {
剪辑路径：插入（100%01%0）；
}
40% {
剪辑路径：插入（99%01%0）；
}
45% {
剪辑路径：插入（46%0 49%0）；
}
50% {
剪辑路径：插入（16%08%0）；
}
55% {
剪辑路径：插入（16%0 72%0）；
}
60% {
剪辑路径：插入（19%0 80%0）；
}
65% {
剪辑路径：插入（8%09%0）；
}
70% {
剪辑路径：插入（88%06%0）；
}
75% {
剪辑路径：插入（32%0 30%0）；
}
80% {
剪辑路径：插入（46%0 47%0）；
}
85% {
剪辑路径：插入（78%0 21%0）；
}
90% {
剪辑路径：插入（60%09%0）；
}
95% {
剪辑路径：插入（48%0 49%0）；
}
100% {
剪辑路径：插入（23%0 64%0）；
}
}
.小故障：：之后{
内容：attr（数据文本）；
位置：绝对位置；
左：2px；
文本阴影：-1px0红色；
排名：0；
溢出：隐藏；
动画：噪波动画2s无限线性交替反转；
}
@关键帧噪波-anim-2{
0% {
剪辑路径：插入（19%0 72%0）；
}
5% {
剪辑路径：插入（6%0 35%0）；
}
10% {
剪辑路径：插入（32%0 35%0）；
}
15% {
剪辑路径：插入（97%03%0）；
}
20% {
剪辑路径：插入（19%057%0）；
}
25% {
剪辑路径：插入（85%0 16%0）；
}
30% {
剪辑路径：插入（46%0 46%0）；
}
35% {
剪辑路径：插入（83%0 15%0）；
}
40% {
剪辑路径：插入（66%0 18%0）；
}
45% {
剪辑路径：插入（90%08%0）；
}
50% {
剪辑路径：插入（58%0 34%0）；
}
55% {
剪辑路径：插入（38%061%0）；
}
60% {
剪辑路径：插入（93%06%0）；
}
65% {
剪辑路径：插入（4%0 83%0）；
}
70% {
剪辑路径：插入（57%0 38%0）；
}
75% {
剪辑路径：插入（97%04%0）；
}
80% {
剪辑路径：插入（9%057%0）；
}
85% {
剪辑路径：插入（7%0 82%0）；
}
90% {
剪辑路径：插入（14%054%0）；
}
95% {
剪辑路径：插入（94%06%0）；
}
100% {
剪辑路径：插入（9%0 49%0）；
}
}
.小故障：：以前{
内容：attr（数据文本）；
位置：绝对位置；
左：-2px；
文本阴影：1px0蓝色；
排名：0；
颜色：淡紫罗兰色；
溢出：隐藏；
动画：noise-anim-2 15s无限线性交替反转；
}

自由
[
/
/
/
]
[ ᴄʟɪᴄᴋ ᴍᴇ ]    

你能添加完整的代码吗，可能还有一个代码演示？看起来

freedom

文本可能有一个绝对的位置，而且它们不在同一个孩子身上。嗨，你有什么不和谐的地方吗？或者我应该把它上传到google drive/dropbox吗？我可以分享源代码；-；我是一个初学者，就像我是一个非常棒的人一样it’但是同时学习。看，如果你看不见，请告诉我。

    <p id="einz" style="color: rgb(255, 255, 255);">
    <!--marquee direction="right" speed="1" onmouseover="this.stop();" onmouseout="this.start();"-->
    [ <a id="einz" href="bla bla bla" target="blank" rel=noopener>discord</a> / 
    <a id="einz" href="bla bla bla" target="blank" rel=noopener>steam</a> /
    <a id="einz" href="bla bla bla" target="blank" rel=noopener>youtube</a> /
    <a id="einz" href="bla bla bla" target="blank" rel=noopener>github</a> ] 

CSS
```#einz
{
  
  text-align: center;
  font-weight: normal;
  font-family: 'Courier', sans-serif;
  text-shadow: 1px 1px 1px rgba(0,0,0,100), 1px 1px 1px rgba(0,0,0,100);
  margin: 0 auto;
  z-index: 1;
  font-size: 12px;
}