Wordpress循环堆栈twitter bootstrap缩略图，而不是使它们内联

So I am using a twitter bootstrap framework called Roots, and this is my second post about this problem and a few people said I did not have enough information so i will provide as much as possible.

Problem: Twitter bootstrap thumbnails are stacking on top of each other in the index.php instead of being side by side.

Code (Forgive me if its messy. I have read the code pasting tips and still do not understand.. that is why it i is indented weird)

 <div class="container">
    <div class="row">
      <div class="col-md-3 pull-right">
      <?php dynamic_sidebar('sidebar-primary'); ?>
      </div>
      <?php get_template_part('templates/page', 'header'); ?>

      <div class="col-md-9">
      <?php if (!have_posts()) : ?>
      <div class="alert alert-warning">
      <?php _e('Sorry, no results were found.', 'roots'); ?>
      </div>
      <?php get_search_form(); ?>
      <?php endif; ?>
      <?php while (have_posts()) : the_post(); ?>
       <?php get_template_part('templates/content', get_post_format()); ?>
      <?php endwhile; ?>
      <?php if ($wp_query->max_num_pages > 1) : ?>
      </div>
      <nav class="post-nav">
     <ul class="pager">
      <li class="previous"><?php next_posts_link(__('&larr; Older posts', 'roots')); ?></li>
      <li class="next"><?php previous_posts_link(__('Newer posts &rarr;', 'roots')); ?></li>
     </ul>
      </nav>
    </div>
  </div>
  <?php endif; ?>

Sorry I cant post pictures because I need 10 reputation...but i can give u links instead

Bootstrap thumbnails stacking

        <article <?php post_class(); ?>>
      <header>
        <div class="container">
         <div class="row">
            <div class="col-sm-6 col-md-3">
             <div class="thumbnail">
                <?php if(has_post_thumbnail()) : ?>
                     <a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>" >
                    <?php the_post_thumbnail(); ?>
                       </a>
                  <?php endif; ?>
                <div class="caption">
                     <h3 class="thumbnail-label"><a class="" href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
                    <?php get_template_part('templates/entry-meta'); ?>
                     <div class="entry-summary">
                    <?php the_excerpt(); ?>
                      </div>
                </div>
              </div>
            </div>
          </div>
        </div>
        </header>
    </article>

This is the best i can do and if that isnt good enough please give me tips...im very new to this and i am trying to learn. If there are any workarounds my main goal is to have the thumbnails in rows of 3