Моя Bootstrap Grid не в хорошем состоянии.Изображения отображаются как разные размеры

Question

Снимок Bootstrap Grid

Привет, Кто-нибудь может объяснить, почему моя сетка не прямая и почему изображения не одного размера?

Я использовал одно и то же изображение несколько раз.

Спасибо

<div class="container">
  <div class="jumbotron">
  <h1>The Image Gallery</h1>
  <p>Images for real people </p>
  </div>

   <div class="row">
     <div class="col-lg-4  col-sm-6">
       <div class="thumbnail">
       <img src="http://i.imgur.com/qK42fUu.jpg">
       </div>
     </div>
      <div class="row">
     <div class="col-lg-4 col-sm-6">
       <div class="thumbnail">
       <img src="http://i.imgur.com/qK42fUu.jpg">
       </div>
     </div>
      <div class="row">
     <div class="col-lg-4 col-sm-6">
       <div class="thumbnail">
       <img src="http://i.imgur.com/qK42fUu.jpg">
       </div>
     </div>
      <div class="row">
     <div class="col-lg-4 col-sm-6">
       <div class="thumbnail">
       <img src="http://i.imgur.com/qK42fUu.jpg">
       </div>
     </div>
      <div class="row">
     <div class="col-lg-4 col-sm-6">
       <div class="thumbnail">
       <img src="http://i.imgur.com/qK42fUu.jpg">
       </div>
     </div>

Answer 1

Правильно отформатированный HTML-код выглядит следующим образом.Обратите внимание, что ни один из ваших .row элементов не имеет закрывающих тегов.Это означает, что каждая последующая строка вложена в предыдущую, что приводит к визуальным несоответствиям - так как поля для каждой строки составляют.

Добавьте несколько закрывающих тегов и правильно отформатируйте HTML, и вам будет хорошо.

<div class="row">
    <div class="col-lg-4  col-sm-6">
        <div class="thumbnail">
             <img src="http://i.imgur.com/qK42fUu.jpg">
        </div>
    </div>
    <div class="row">
        <div class="col-lg-4 col-sm-6">
            <div class="thumbnail">
                <img src="http://i.imgur.com/qK42fUu.jpg">
            </div>
        </div>
        <div class="row">
            <div class="col-lg-4 col-sm-6">
                <div class="thumbnail">
                    <img src="http://i.imgur.com/qK42fUu.jpg">
                </div>
            </div>
            <div class="row">
                <div class="col-lg-4 col-sm-6">
                    <div class="thumbnail">
                        <img src="http://i.imgur.com/qK42fUu.jpg">
                    </div>
                </div>
                <div class="row">
                    <div class="col-lg-4 col-sm-6">
                        <div class="thumbnail">
                            <img src="http://i.imgur.com/qK42fUu.jpg">
                        </div>
                    </div>