无法在中心对齐绝对 div [重复]答案

【问题标题】：Can not align absolute div in center [duplicate]无法在中心对齐绝对 div [重复]
【发布时间】：2019-09-04 09:13:25
【问题描述】：

可能这与它的位置是absolute 的事实有关，但您仍然如何将absolute 定位为div 居中？

使用top，而不是margin-top 有效，但left 代替margin-left 不会影响它 .为什么？

.title
{
  display:block;
  position: absolute;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  height: 10%;
  top : 80%;
}




<div class="title fontHugeTitle2"><h1> The Best  In Town </h1></div>

【问题讨论】：

你的html代码是什么？能否添加完整的相关代码

标签： css

【解决方案1】：

left: auto; right: auto 不能像 margin: 0 auto 那样使 div 居中，但是你有一个固定的宽度，你可以将 left 属性设置为剩下的一半，例如left: 5%

【讨论】：

谢谢，我不明白 :) 我明白该怎么做，但不明白为什么它不能与左/右自动一起工作
您的解决方案有效，但为什么我的解决方案无效？背后的逻辑是什么？
@Curnelious 'left:auto' 和 'right:auto' 不适用于居中层。它们用于覆盖现有位置。例如，如果您想将图层大小从左侧设置为实际大小，请先设置“left:0”，然后在事件后设置“left:auto”。
@Curnelious 至于预期的结果，文档说 - '当左和右都被定义时，元素的位置被过度指定。在这种情况下，当容器从左到右时，left 值优先（因此，right 的计算值设置为 -left）；当容器从右到左时，右值具有优先权（因此，left 的计算值设置为 -right）。 - developer.mozilla.org/en-US/docs/Web/CSS/left
@VelimirTchatchevsky 我没有设置左右，所以你刚刚展示的文档是不相关的。我确实将它们设置为自动，文档应该使元素居中。仍然不确定为什么绝对元素不会听他们。

【解决方案2】：

添加

div {
  width: 100%;
}

改变

<div class="title fontHugeTitle2"><h1> The Best  In Town </h1></div>

到

<div class="fontHugeTitle2"><h1 class="title"> The Best  In Town </h1></div>

【讨论】：