垂直对齐两个分区

Question

一切都是网络编程的新手.

我试图垂直对齐两个包装器div,以便它们位于页面的中间,而不管浏览器.该网站可在此处找到:www.armedwithreason.com/massshooting

我已经在这个问题上查了几十个教程,并且无法获得任何工作.有任何想法吗？

Answer 1

你已经设置width并height在这两个DIV,那么你可以使用这样的代码:

.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的左上角放在中间,然后用/正/负边距调整它的位置.

JsFiddle(一个有自己风格的基本款)