Растянуть изображение, чтобы он соответствовал полной загрузке контейнера.

Question

У меня есть изображение шириной 1300 пикселей, с использованием бутстрапа. Я хочу, чтобы это изображение заполнило всю ширину моего контейнера, который установлен в 1300 пикселей. Я создаю строку, даю ей полные 12 столбцов, а затем добавляю изображение с классом реагирования. С этой настройкой я получаю вывод ниже.

Я хочу, чтобы мое изображение, чтобы растянуть весь путь вместе, где мой образ в моем содержании, вот мой код.

<div class="row"> 
    <div class="container"> 
     <div class="col-md-12"> 
     <img src="<?php bloginfo('template_directory'); ?>/assets/img/homeBanner.jpg" alt="placeholder 960" class="img-responsive"/> 
     </div> 
    </div> 
    </div> 

Изображение установлено на ширину 100%, поэтому не уверен, почему он не заполняет контейнер.

Answer 1

Проверьте, если это поможет вам

<div class="container-fluid no-padding"> 
    <div class="row"> 
    <div class="col-md-12"> 
     <img src="https://placeholdit.imgix.net/~text?txtsize=33&txt=1300%C3%97400&w=1300&h=400" alt="placeholder 960" class="img-responsive" /> 
    </div> 
    </div> 
</div> 

CSS

.no-padding { 
    padding-left: 0; 
    padding-right: 0; 
} 

Css класс "не-набивка" не заменит стандартный загрузчик контейнера отступы.

Полный пример: https://jsfiddle.net/3hk9b1a2/

Answer 2

container класса 15px оставил & правых отступов, так что если вы хотите, чтобы удалить эту прокладку, использовать следующее, потому что row класса имеет -15px оставил & правый край.

<div class="container"> 
    <div class="row"> 
    <img class='img-responsive' src="#" alt="" /> 
    </div> 
</div> 

Codepen: http://codepen.io/m-dehghani/pen/jqeKgv