Ошибка на дисплее см с начальной загрузки

Question

я не смог выровнять блоки по горизонтали на дисплее см [мин-ширина: 768px]

вы можете нажать на изображение, иллюстрирующее мою проблему отображения выше, и я вставил свой HTML блок также!

Мне нужна помощь!

<div class="row"> 
 
      
 
      <div class="col-sm-4 border1gris text-center"> 
 
       <a href="{{ path('..') }}"> 
 
        <img class="img-responsive center-block" src="img1" alt=""/><br>Text Text Text Text Text 
 
       </a> 
 
      </div> 
 
      
 
      
 
      <div class="col-sm-4 border1gris text-center"> 
 
       <a href="{{ path('..') }}"> 
 
        <img class="img-responsive center-block" src="img2" alt=""/><br>Text Text Text Text Text 
 
       </a> 
 
      </div> 
 
     
 
      
 
      <div class="col-sm-4 border1gris text-center"> 
 
       <a href="{{ path('..') }}"> 
 
        <img class="img-responsive center-block" src="img3" alt=""/><br>Text Text Text Text Text 
 
       </a> 
 
      </div> 
 
     </div>

Answer 1

У меня есть решение вашей проблемы, Пожалуйста, проверьте эту ссылку. https://jsfiddle.net/hu4qLy4n/

Изменения в HTML

<a href="#"> 
    <div class="img-container3"> 
     <img class="img-responsive center-block" src="https://www.webkit.org/blog-files/acid3-100.png" alt="" /> 
    </a> 

Изменения в CSS

.img-container1{ 
    width:249px; 
    height: 200px; 
    margin:0 auto; 
    } 
.img-container1 img{ 
    width:100%; 
} 
.img-container2{ 
    width:200px; 
    height: 263px; 
    margin:0 auto; 
    } 
.img-container2 img{ 
    width:100%; 
} 
.img-container3{ 
    width:249px; 
    height: 281px; 
    margin:0 auto; 
    } 
.img-container3 img{ 
    width:100%; 
} 

Try, чтобы не дать высоту изображений, а также попытаться положить сторону изображения модули контейнер. Контейнер должен быть вашей необходимой шириной, а изображения должны быть на 100% ширины.