中心绝对定位

Question

我知道如何使用position: relative;和margin:auto;轻松地将div与CSS居中，但我有一个div应该在所有其他div之前 - 所以我设置{{1} }和z-index: 1000;。如果我尝试亲戚，那么我无法找出任何其他方法在没有position:absolute;的情况下将其设置在前面，然后它会低于其他所有内容。我的问题是如何设置这个以position: absolute;为中心的div？

我尝试z-index: 1000; position: absolute;看起来很完美，但是当它显示在更大的屏幕或更小的屏幕上时，显然百分比不会相同。

Answer 1

你可以做以下两件事之一：

1. 给出固定的％宽度，并将数学计算为中心：

position:absolute;width:60%;left:20%（100%-60% = 40% - ＆gt; 40% / 2 = 20%）

2。使用position:absolute;text-align:center;定位div，并给出内部元素position:relative;display:inline-block;

Answer 2

确保您的div具有宽度和高度，然后50％定位，边距为负值的一半。例如。一个div 100px x 100px：

z-index: 1000; 
position: absolute;

top: 50%;
left: 50%;
margin-left: -50px;
margin-top: -50px;

Answer 3

您仍然可以在z-index div上使用position:relative。只需确保所有其他z-index对象也需要具有声明的位置。