Bootstrap: проблема с пространством сточных вод

Question

Я использую шаблон шаблона Bootstrap sb. Я попытался добавить 3 cols подряд, но проблема в том, что вокруг этих полей нет места, и они объединены вместе. Я попытался изменить файл bootsrap по ссылке cdn, удалил все файлы css один за другим, но это не сработало. Это мой HTML структура (Codeigniter вид)

<div class="container-fluid"> 
    <div class="row"> 
     <div class="col-lg-12"> 
      <h1 class="page-header"> Services </h1> 
     </div> 
    </div> 
    <div class="row"> 
     <div class="col-md-3 col-sm-3 col-xs-12 service-block"> 
      <img src="<?php echo base_url()?>assets/images/service-1.png" class="img-responsive center-block"> 
      <h3 class="text-center">Body Works</h> 
     </div> 
     <div class="col-md-3 col-sm-3 col-xs-12 service-block"> 
      <img src="<?php echo base_url()?>assets/images/service-1.png" class="img-responsive center-block"> 
      <h3 class="text-center">Body Works</h> 
     </div> 
     <div class="col-md-3 col-sm-3 col-xs-12 service-block"> 
      <img src="<?php echo base_url()?>assets/images/service-1.png" class="img-responsive center-block"> 
      <h3 class="text-center">Body Works</h> 
     </div> 

    </div> 
    <!-- /.row --> 
</div> 

Это единственный CSS для этих услуг блоков

.service-block{ 
     background: #EDEDED; 
     height: 220px; 
    } 
    .service-block img{ 
     margin-top: 15%; 
     margin-bottom: 9px; 
    } 

Это выход я получаю

может кто-то помочь мне может быть вопрос с этим

Answer 1

Y ou имеет 3 столбца в одной строке, но каждый столбец резервирует 3 пробела в сетке, что будет 9. Но bootstrap требует, чтобы вы заполнили 12 пробелов в сетке. Так что используйте:
<div class="col-md-4 col-sm-4 col-xs-12 service-block">