Bootstrap列问题

Question

我遇到了几张背景图片的问题。我连续两列。每列中都有另一个div，用于保存背景图像。由于某些奇怪的原因，右侧的图像低于左侧。我似乎无法弄明白为什么。

<div class="row">
    <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
        <div class="signs-box">
            <p>text</p>
        </div>
    </div>
    <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
        <div class="person-box">
            <h2>title</h2>
        </div>
    </div>
</div>

和css：

.signs-box {
    background-image: url("/images/image1.jpg");
    background-size: cover;
    background-repeat: no-repeat;
    min-height: 595px;
}

.person-box {
    background-image: url("/images/image2.jpg");
    background-size: cover;
    background-repeat: no-repeat;
    min-height: 595px;
}

Answer 1

这是因为在引导程序中<p>和<h2>上设置了不同的顶部边距。这会影响父容器的位置。您可以通过设置来修复它，如下所示：

.signs-box p, .person-box h2{
     margin-top:0; 
}

See the difference here

Answer 2

p和h2可能有不同的边距，他们正在向下推动他们的父div，而不仅仅是将自己定位在其中。