Question

在我的嵌套列（col-md-6）中，我包含了两行。不幸的是，第二行中的（较小的）图片不与第一列和整个页面内容的其余部分水平对齐。 col-md-4中是否有比col-md-12更大的余量，还是有其他原因吗？

谢谢！

  <div class="col-md-6 col-md-height">
     <div class="row">
        <div class="col-md-12">
           <a href="images/e1/expose1.jpg" data-lightbox="roadtrip">
             <img src="images/e1/expose1.jpg" class="center-block img-responsive" width="100%">
           </a>
           blabla
        </div>
     </div>
     <div clas="row">
        <div class="col-md-4">
           <a href="images/e1/s1.jpg" data-lightbox="roadtrip">
              <img src="images/e1/s1.jpg" class="img-responsive">
           </a>
        </div>
        <div class="col-md-4">
           <img src="images/e1/s2.jpg" class="img-thumbnail">
        </div>
        <div class="col-md-4">
           <img src="images/e1/s3.jpg" class="img-thumbnail" >
        </div>      
     </div>
  </div>

Answer 1

这可能是因为您在最后两张图片上使用的img-thumbnail课程。

尝试将它们转换为img-responsive

行中的Bootstrap嵌套列不与上一行中的列对齐

1 个答案: