Как пофиксить размер фото на мобильном в PrettyPhoto Jquery?

Question

[ValeraValera]

Сайт на Wordpress лежит здесь d0006458.atservers.net
в шапке идет список адресов , по клику на адрес в попапе открывается картинка со схемой проезда,
работает через плагин “prettyPhoto”
Проблема в том что когда открываешь это на мобильном появляется значок масштабирования и когда по нему кликаешь , изображение выходит за ширину дисплея и появляется горизонтальный скрол ,

как это пофиксить, чтобы изображение было 100% на мобильной версии .

Answer 1

[iBird Rose]

вставь в media:

@media (max-width: 500px)
{
    .pp_pic_holder.pp_default
    {
        width: 100%!important;
        margin-top:-100px !important;
        left: 0!important;
        overflow: hidden;
    }
    div.pp_default .pp_content_container .pp_left
    {
        padding-left: 0!important;
    }
    div.pp_default .pp_content_container .pp_right
    {
        padding-right: 0!important;
    }
    .pp_content
    {
        width: 100%!important;
        height: auto!important;
    }
    .pp_fade
    {
        width: 100%!important;
        height: 100%!important;
    }
    a.pp_expand,
    a.pp_contract,
    .pp_hoverContainer,
    .pp_gallery,
    .pp_top,
    .pp_bottom
    {
        display: none!important;
    }
    #pp_full_res img
    {
        width: 100%!important;
        height: auto!important;
    }
    .pp_details
    {
        box-sizing: border-box;
        width: 100%!important;
        padding-left: 3%;
        padding-right: 4%;
        padding-top: 10px;
        padding-bottom: 10px;
        background-color: #fff;
        margin-top: -2px!important;
    }
    a.pp_close
    {
        right: 10px!important;
        top: 10px!important;
    }
}

нашел тут: stackoverflow.com/questions/13778714/optimize-pret...