Поддержка Проблемы и решения Мобильная версия сайта не адаптируется

  • Решено makssskam

    (@makssskam)


    Здравствуйте! У меня сделан сайт с темой OceanWP. В настройках есть возможность посмотреть, как будет выглядеть сайт на ПК, Планшете и Смартфоне. Есть проблема в отображением авторизации на смартфоне и планшете. Заключается она в том, что сайт не адаптируется на 100% ширины экрана. Такая же проблема есть и со страницей корзины, и со страницей оформления заказа, если я делаю их под себя, а не использую готовые от WooCommerce.

    • Тема изменена 2 года назад пользователем makssskam.

    Страница, с которой нужна помощь: [войдите, чтобы увидеть ссылку]

Просмотр 2 ответов — с 1 по 2 (всего 2)
  • Есть проблема в отображением авторизации на смартфоне

    Попробуйте добавить в дополнительные стили:

    
    @media (max-width: 560px){
    
    .elementor-element-d674b9b > .elementor-container{
     max-width: 100% !important;
    }
    
    .elementor-element-bb0b223 > .elementor-widget-wrap{
     margin-left: 0 !important;
     margin-right: 0 !important;
    }
    
    .eael-advance-tabs[data-tabid="4a77ec4"]{
     padding: 0 !important;
    }
    
    [data-tabid="4a77ec4"] > .eael-tabs-content > .clearfix{
     padding-left: 0 !important;
     padding-right: 0 !important;
    }
    
    .elementor-element-f25c426 > .elementor-container{
     max-width: 100% !important;
     padding-left: 0 !important;
     padding-right: 0 !important;
    }
    
    .elementor-element-fc359d1 > .elementor-widget-wrap{
     padding-left: 0 !important;
     padding-right: 0 !important;
    }
    
    .elementor-element-9d42ff2 .eael-login-form-wrapper{
    width: 100% !important;
    max-width: 370px !important;
    min-width: 330px !important;
    }
    
    .elementor-element-9d42ff2 .lr-form-wrapper{
    width: 100% !important;
    max-width: 370px !important;
    min-width: 330px !important;
    }
    
    /* --------------------- */
    
    .elementor-element-68f19a7 > .elementor-container{
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    }
    
    .elementor-element-33cbbb4 > .elementor-widget-wrap{
    padding-left: 0 !important;
    padding-right: 0 !important;
    }
    
    .elementor-element-6b06a26 .eael-lr-form-wrapper{
    width: 100% !important;
    max-width: 370px !important;
    min-width: 330px !important;
    }
    
    .elementor-element-6b06a26 .lr-form-wrapper{
    width: 100% !important;
    max-width: 370px !important;
    min-width: 330px !important;
    padding-left: 15px !important;
    padding-right: 15px !important;
    }
    
    } /* max-width: 560px */
    
    
    Автор makssskam

    (@makssskam)

    Помогло! Огромное вам спасибо.

Просмотр 2 ответов — с 1 по 2 (всего 2)
  • Тема «Мобильная версия сайта не адаптируется» закрыта для новых ответов.