无法在中心对齐固定的 div

Question

我目前有一个div 想要的位置：固定;

它工作正常，但div 的定位不再。

我试过边距：自动和文本对齐：居中，但仍然没有。我尝试在我的主要div 周围有一个div，而外部一个被修复，但仍然什么都没有。

没有位置：固定它会以我想要的方式居中。带位置：固定;它只会向左走。

有人知道解决方案吗？

Answer 1

您需要添加left: 0和right: 0;以居中fixed定位的元素。

.dd {
    position: fixed;
    width: 50%;
    height: 100px;
    background: lightgreen;
    left: 0;
    right: 0;
    margin: 0 auto;
}

<div class="dd"></div>

Answer 2

如果要对齐位置：固定元素，则需要将坐标值添加到顶部，左侧，右侧和底部。或者至少其中两个。

position: fixed;
top: 50%;
left: 50%;

然后，您必须将元素平移到正中，因为 0/0 坐标它位于元素的上/左角。

您可以使用

transform: translate(-50%, -50%);

Answer 3

使用 top 、 left 和 transform

.fixed{
  position:fixed;
  width:200px;
  height:200px;
  background-color:green;
  left:0;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
}

<div class="fixed">
</div>