Php 引导第3列在第2行3/4列之后中断

我正在使用wordpress引导设计，我正在使用一些PHP来输出帖子

然而，无论采用哪种方法，无论是col-3、col-4、col-2，我都会在它自己的列中对齐一个投资组合项目，然后返回正确的列

这是我的密码：

<article id="post-<?php the_ID(); ?>" <?php post_class('col-lg-4 col-sm-4 pbox'); ?>>

    <?php
        $thumb = get_post_thumbnail_id();
        $img_url = wp_get_attachment_url( $thumb,'full' ); //get full URL to image (use "large" or "medium" if the images too big)
        $image = aq_resize( $img_url, 720, 560, true ); //resize & crop the image
    ?>

    <?php if($image) : ?>
    <a href="<?php the_permalink(); ?>"> <img class="img-responsive" src="<?php echo $image ?>"/></a>
    <?php endif; ?> 

    <h2 class="box-title"><a href="<?php the_permalink(); ?>" rel="bookmark"><?php the_title(); ?></a></h2>
    <div class="box-meta"><?php the_category(', '); ?></div>    
    <div class="entry-summary">
        <?php the_excerpt(); ?>
    </div><!-- .entry-summary -->

---

谢谢你的帮助

这似乎是浮动的问题

我建议在中断之前添加以下内容：

<div class="clearfix"></div>

这是一个内置的Boostrap类，用于清除所有浮动

如果您只希望应用于某些宽度，请尝试以下操作：

<div class="clearfix hidden-xs"></div>

---

您可以看到响应实用程序的列表。

我曾经遇到过同样的问题，这是因为每列的高度不同。我指定了一个固定的柱高度，事情开始看起来很好。这是我的帖子，在我弄明白之前没有人回复

请参阅我刚才做的以下测试（第二行，第三列是200x190，其他所有内容都是200x200）

200x190使最后一个div向右移动。但是，如果我们为每个div指定一个固定的高度，那么事情看起来正常，如下所示（第二行第三个div仍然是200x190）

下面是

---

因此，我建议仅出于测试目的，将height:200px；添加到您的.pbox中，看看会发生什么。

发布了您的问题的答案。如果您想要更详细的帮助，请发布从PHP代码生成的HTML，以便我可以为您提供一个工作示例。或者您可以将生成的HTML和CSS复制/粘贴到bootply和f我找出了问题所在。bootply是练习bootstrap相关问题的最佳场所。谢谢Raf，将height:560px添加到.pbox类中，解决了这个问题，只是为了澄清@fizzix上面所说的，哪一个更合适？也可能是，我没有尝试过他的解决方案，也不知道它是如何工作的。当涉及到我的解决方案，如果您担心所有设备的固定高度，那么您可以通过为不同的视口提供不同的固定宽度来解决这个问题，例如，大屏幕为560px，中屏幕为360px，等等。我的解决方案对我来说是完美无瑕的。请参阅以了解媒体质量，不要忘记标记任何对我有效的解决方案请回答我

<div class="clearfix hidden-xs"></div>