css - 垂直对齐两个 div

Question

对一切网络编程的新知识。

我正在尝试垂直对齐两个包装器 div，以便它们位于页面中间，而与浏览器无关。该网站可在此处找到：www.armedwithreason.com/massshooting

我已经查阅了数十个关于这个问题的教程，但无法进行任何工作。有任何想法吗？

Answer 1

您已经在这两个 div 上设置了width和height，然后您可以使用这种代码：

.wrapper {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -170px;
    margin-left: -300px;
}
.wrapper2 {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: 150px;
    margin-left: -300px;
}

使用top: 50%; left: 50%，您将 div 的左上角放在中间，然后使用 /positive/negative 边距调整其位置。

JsFiddle（有自己风格的基本款）