1. Уважаемые пользователи, прежде чем ответить в теме или создать новую, внимательно ознакомьтесь с Правилами раздела
    Скрыть объявление

[Помогите] Прокрутка в мобильной версии из за картинок

Тема в разделе "Вёрстка (HTML, CSS)", создана пользователем iga, 18 авг 2018.

  1. iga

    iga

    Регистрация:
    6 фев 2014
    Сообщения:
    285
    Симпатии:
    53
    Вот ссылка на одну из проблемных страниц. Сайт на WP. Галерея реализована с помощью аддона к visual composer - Masonry Gallery. В настройках установлена ширина 550px.
    [​IMG]
    Больше никаких настоек нет.

    При схлопывании в мобильную версию картинка оказывается шире, чем видимая область и появляется прокрутка.
    Картинка обёрнута в li, которому как раз и задана эта самая ширина 550px. Бутстраповский img-responsive не активируется.
    Полдня бьюсь, не могу победить!
     
  2. Dotrox

    Dotrox Команда форума

    Регистрация:
    27 ноя 2012
    Сообщения:
    3.198
    Симпатии:
    1.306
    Для начала уберите с тегов img это:
    Код:
    width='550' height='366'
    Никакой CSS не будет работать, если у вас размеры заданы атрибутами.
     
  3. iga

    iga

    Регистрация:
    6 фев 2014
    Сообщения:
    285
    Симпатии:
    53
  4. Dotrox

    Dotrox Команда форума

    Регистрация:
    27 ноя 2012
    Сообщения:
    3.198
    Симпатии:
    1.306
    Ну, это уже вопрос не вёрстки, а вашего движка. Я вижу, что эти атрибуты с размером есть в исходном коде страницы.
     
  5. iga

    iga

    Регистрация:
    6 фев 2014
    Сообщения:
    285
    Симпатии:
    53
  6. iga

    iga

    Регистрация:
    6 фев 2014
    Сообщения:
    285
    Симпатии:
    53
    В общем, теперь я научился как убирать атрибуты width и height с помощью javascript, но это мне мало помогло.

    Помогла перебивка стилей:
    Код:
    @media all and (max-width: 551px){
        .pinterest-container li {
            width: 110%!important;
            left: -16px!important;
        }
    }
    Изначально методом тыка, я в этот вариант, видимо, просто не попал :(