WordPress文章破坏了HTML网格布局

Question

每次我发布一个WordPress文章时，我的三列HTML网格都会完全乱掉(元素向左浮动，在应该有元素的位置上有空隙)。但是当我删除该文章并刷新页面后，网格的格式就恢复正常了。

这里是主循环：

    <div id="howTo" class="howTo">
        <div class="small-12 columns mainWrap">
            <h1 class="text-center"><span class="cb-howTo"></span>Skills</h1>
            <?php $loop = new WP_Query( array( 'order' => 'asc', 'category_name' => 'des-skill') ); ?>
            <?php if ( have_posts() ) : while ( $loop->have_posts() ) : $loop->the_post(); ?>
                <a href="<?php the_permalink(); ?>">
                    <div class="small-12 medium-4 columns article">
                        <div class="articleImgWrap dzsparallaxer auto-init use-loading" data-options='{ direction: "normal" }'  role="banner">
                            <div class="articleImg dzsparallaxer--target" style="background-image: url('<?php echo wp_get_attachment_url( get_post_thumbnail_id( $post->ID ) ); ?>');"></div>
                            <div class="imgOverlay">
                                <h4 class="text-center articleHead"><?php the_title(); ?></h4>
                            </div>
                        </div>
                        <div class="excerpt"><?php echo get_the_excerpt(); ?></div>
                    </div>
                </a>
            <?php endwhile; // end of the loop. ?>
            <?php endif; ?>
        </div>
    </div>

我正在使用Foundation，但是当我删除那个帖子时，网格就正常了。

- user6326621

---

是的，我以前也遇到过这种情况。你的帖子标题是什么？ - agon024

哇，那真是太快了！它的“用户满意度 > 较少点击”。 - user6326621

Answer 1

问题在于我认为WordPress将像<和>这样的字符视为html元素的开头和结尾。所以我认为在循环中，它过早地关闭了你的html元素。尝试从文章标题中删除">"，看看是否可以解决网格问题。

- agon024

---

哇！这修好了。我甚至没有意识到 WordPress 会做这样的事情。 - user6326621

WordPress有时候可能会有点棘手。这是一个好问题。希望能帮助到其他人。 - agon024