Bootstrap & отзывчивость изображения

У меня есть веб-сайт, который полностью отзывчив, но есть одна часть, которая не отвечает, и находится ниже лозунга URBAN FREE SPIRIT (я говорю об изображениях). Я пытался иметь контейнер класса, класс img-отзывчивый, но, похоже, ничего Работа..

Вот мой сайт, я думаю, что инспектора будет легче просматривать, чем копировать

http://v1954132.caqoajqezbu9.demo42.volusion.com/

1 ответ

Решение

.home-stage-v2 не отвечает.

.home-stage-v2 {
  width: 1000px;
  height: 1200px;
  position: relative;
  margin-top: 25px;
}

Примените к нему медиа-запросы для различной ширины.

@media (min-width: 1200px) {
    .home-stage-v2 {
      width: 1000px;
    }
}

@media (max-width: 1199px) {
    .home-stage-v2 {
      width: 100%;
    }
}

Пример выше. Вам также придется переделывать изображения, так как они имеют фиксированную ширину и также не реагируют на изменения ширины. Я бы предложил переработать их в проценты или поместить в сетку.

http://getbootstrap.com/examples/grid/ для примеров по сеткам.

Другие вопросы по тегам