Как избавиться от определенной маржи в Twitter Bootstrap 3?

Question

Я не знаю почему, но странный запас появляется на сайте, сделанном с помощью Twitter Bootstrap 3. Если я стираю элемент, который его вызывает, маржа исчезает. Но элемент (изображение) правильно помещен.

Элемент состоит в том, что я отмечен красной стрелкой here (третье изображение с женщиной & ребенок).

Я написал код следовать:

<div class="container"> 
    <div class="row"> 
     <div class="col-xs-4 col-md-4 col-lg-4"> 
      <div id="esc1"> 
      <img class="img-responsive center-block" alt="" src="img/escuela-1.png"></div> 
     </div> 
     <div class="col-xs-4 col-md-4 col-lg-4"> 
     <div id="esc2"> 
      <img class="img-responsive center-block" alt="" src="img/escuela-2.png"></div> 
     </div> 
     <div class="col-xs-4 col-md-4 col-lg-4"> 
     <div id="esc3">   
      <img class="img-responsive center-block" alt="" src="img/escuela-3.png"></div> 
     </div> 
    </div> 
    </div> 

URL сайта: Here

Может кто-нибудь мне помочь? Заранее спасибо!

Answer 1

<div class="row"> 
      <div class="container"> 
      <div class="row"> 
       <div class="col-xs-12 col-md-12 col-lg-12"> 
        <div id="cartel2"> 
        <div class="cartel-img"><img class="img-responsive center-block" alt="" src="img/cartel-centros-solo.png"> </div> 
        </div> 

Раздел должен быть:

<div class="**container**"> 
      <div class="**row**"> 
       <div class="col-xs-12 col-md-12 col-lg-12"> 
        <div id="cartel2"> 
        <div class="cartel-img"><img class="img-responsive center-block" alt="" src="img/cartel-centros-solo.png"> </div> 
        </div> 

Это сделало маржу d для меня.

Answer 2

Оберните свой div внутри строки с помощью <div class="col-xs-12"></div>. Прямо сейчас вы говорите, что divs отображаются в блоке из четырех, и ничто для этого не должно делить.

Поскольку BS3 является мобильным первым, если вы определяете свою сетку как col-xs-4, вам не нужно определять col-md и col-lg. Вам нужно только это сделать, если вы хотите, чтобы он отображался на большом экране.
Надеюсь, это поможет.

Answer 3

ваша проблема находится на поле под изображениями:

<div class="row"> 
      <div class="container"> 
       <div class="col-xs-12 col-md-12 col-lg-12"> 
        <div class="escuela-def"> 
         <p>La primera y principal razón de ABC KINDERGARTEN es el reconocimiento del niño/a como sujeto desde el momento de su nacimiento.<br> 
En ésta escuela se da una educación integral, que abarca todas las áreas en las que el niño pueda ser estimulado desde pequeño, para alcanzar su máximo desarrollo en un marco bilingüe conectado con la familia.</p> 
      ... 

        </div> 
       </div> 
      </div> 
     </div> 

Вы должны инвертировать .row и .container, см код ниже:

<div class="container"> 
    <div class="row"> 
     <div class="col-xs-12 col-md-12 col-lg-12"> 
         ... 

     </div> 
    </div> 
</div>