html - Bootstrap 是否像简单网格一样对齐两个内容？

Question

我已经为此工作了大约一个星期。我使用 bootstrap 在两列中对齐了两个类，并在内容下方创建了另一个单独的类。当我预览网页时，单独的类与两个类对齐，而不是单独的类位于 2 列网格下方。如何将单独的类放置在两列 Bootstrap 网格下？下面是结果的图像，以及使用的代码。谢谢

   <div class="prod_section">
   <div class="border col-md-6">
      <img src="help.jpg" class="word" alt="h">
      <h2 class="header">SHIRT</h2>
   </div>
   <div class="border col-md-6 ">
      <img src="img/help_two.jpg" alt="" class="word">
      <h2 class="header"> URBAN SHIRT</h2>
   </div>
</div>
<div class="seperate">Is BOOTSTRAP suppose to appear like this?</div>



.prod_section{
    margin:auto;
    width:1300px;
    margin-top:600px;
    margin-bottom: 600px;
}

.word{
    max-width:90%;
    /*box-shadow: 10px 10px 20px #bababa;*/
}

h2{
    font-family: 'Montserrat';
    font-weight:700;
}
.header{
    padding-top:20px;
}
body{
    background:white;
}

Answer 1

尝试将那些 col-md-6 放入 .row div 中，例如:

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