html - 引导网格系统不工作

Question

我有一个网页here我在哪里使用 Bootstrap 网格系统。它应该每列显示三个元素，但如果您向下滚动到第 3/4 行，元素就会开始错位。我注意到，如果只有一个元素比下面的组件稍长，那么整个网格之后就会变得很乱。

下面是整个网格系统中某一项的代码:

<div class="col-sm-12 col-xs-12 col-md-6 col-lg-4">  
      <h4 align="center"><strong>Name</strong></h4>
      <div class="row" align="center">
        <div class="image-cropper">
           <!... personal image...>
        </div>
      <div class="center-justified">
              <!.. sth sth blah blah..>
      </div>
    </div>
</div>

有人知道如何解决这个问题吗？

编辑:我想要实现的是在大屏幕上每行显示每三列，然后当它缩小时它应该只在中屏幕和整行上每行显示每两列对于小屏幕。

目前，如果我每三列环绕一个容器/行，当我将其调整为中等屏幕尺寸(每行只有两个元素)时，当类从 切换时，将会出现白色间隙。 col-lg-4 到 .col-md-6。我想摆脱那个白色的差距。

Answer 1

对于每两列将它们放入这样的容器中将给出您正在寻找的结果:

<div class="container">

    <div class="col-md-6">

        Your code here...

    </div>

    <div class="col-md-6">

        Your code here...

    </div>

</div>

然后对您在网站上写的每两个人执行此操作。希望这对您有所帮助。