文章没有崩溃

Question

我目前正在开发一个Wordpress主题。

我面临的问题如下：

文章不应该崩溃。

PHP＆amp; HTML

<script> 
  /* adds classes based on image orientation */
  $(document).ready(function() {
    $("article:has(.landscape)").addClass( "l-article");
    $("article:has(.portrait)").addClass( "p-article");
  });
</script>
<div class="blog-list container">
  <div class="row grid index-pos">  
    <?php 
       /* wp loop */
    ?>
      /* article that doesn't collapse well */
      <article class="col-md-6 col-sm-12 col-xs-12">
        <a href="<?php the_permalink(); ?>">     
          <?php image_filter($size) ; ?> /* displays wp thumbnail with class .landscape for landscape and .portrait for portrait
        </a>
        <div class="item-holder">
          /* code that shows title and excerpt
        </div>
      </article>
    <?php endwhile; ?>
  </div>
</div>

CSS

article .portrait {
    height: 833px;
}
article .landscape {    
    height: 300px;
}
.l-article {
    height: 530px;
}
.p-article {
    height: 1100px;
}
col.*.* { float:left }

image showing issue

导致问题的原因是什么？

我尝试过使用here中的砌体，但它并没有完成将图像很好地对齐的工作。

谢谢。