I have my page set up so that it displays 3 posts in a row. And then after 4 columns of posts (12 posts) it shows the **ajax load more button.** The problem is that in my code I originally only had one `col-md-4` but it was just showing one post in a row. So I added two additional `col-md-4`. It now shows 3 posts in a row, but it repeats the same 3 posts in each row. Does anyone have a solution for this? 

```html
<?php
get_header();
get_template_part ('inc/carousel-food');

$the_query = new WP_Query( array(
    'posts_per_page' => 12,
    'paged' => get_query_var('paged', 1),
    'cat' => 10,
 ));

if ( $the_query->have_posts() ) {

    // display #ajax wrapper only if we have posts
    echo '<div id="ajax">';

    while($the_query->have_posts()) {
          $the_query->the_post(); ?>

        <article <?php post_class(); ?>>    
            <div class="row">
                <div class="col-md-4"><?php the_post_thumbnail('medium-thumbnail'); ?>
                    <h2><a class="post-title" href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
                    <p class="post-excerpt"><?php echo get_the_excerpt(); ?></p>
                    <?php get_template_part( 'share-buttons' ); ?>
                    <a class="moretext" href="<?php the_permalink(); ?>">Read more</a>
                    <?php comments_popup_link ('No Comments', '1 Comment', '% Comments', 'comment-count', 'none'); ?>
                </div>
                 <div class="col-md-4"><?php the_post_thumbnail('medium-thumbnail'); ?>
                    <h2><a class="post-title" href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
                    <p class="post-excerpt"><?php echo get_the_excerpt(); ?></p>
                    <?php get_template_part( 'share-buttons' ); ?>
                    <a class="moretext" href="<?php the_permalink(); ?>">Read more</a>
                    <?php comments_popup_link ('No Comments', '1 Comment', '% Comments', 'comment-count', 'none'); ?>
                </div>
                 <div class="col-md-4"><?php the_post_thumbnail('medium-thumbnail'); ?>
                    <h2><a class="post-title" href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
                    <p class="post-excerpt"><?php echo get_the_excerpt(); ?></p>
                    <?php get_template_part( 'share-buttons' ); ?>
                    <a class="moretext" href="<?php the_permalink(); ?>">Read more</a>
                    <?php comments_popup_link ('No Comments', '1 Comment', '% Comments', 'comment-count', 'none'); ?>
                </div>
            </div>
        </article>

    <?php }//end while

    echo '</div>'; // close the #ajax wrapper after the post list

    if(get_query_var('paged') < $the_query->max_num_pages) {
        load_more_button();
    }

} else { // if there are no posts

    echo '<p>Sorry, no posts matched your criteria.</p>';

}//end if

get_footer();
?>
```