Mobile menu does not wrap-up

Sydney Pro
#1

Hello there,

my domain is dragoman.ist
Mobile menu stay open on the page and does not wrap-up. Hoe can I fix this?

#2

Hi,

Try adding this CSS code to your website’s Additional CSS under admin area (/wp-admin) > Appearance > Customize.

    #mainnav-mobi.mainnav.hidden {
      display: none;
    }

Regards,
Kharis
aThemes Support

#3

Hi Kharis,

Now the mobile menu is gone and also the site is no longer responsive. Perhaps I have too many additional CSS?

Here is what I have

 @media only screen and (min-width: 480px) {
      .sp-top-search label {
        width: calc(100% - 140px);
        width: -moz-calc(100% - 140px);
        width: -webkit-calc(100% - 140px);
      }
      .sp-top-search input.search-field {
        width: 100%;
      } 
    }  

html,
body {

  overflow-x: hidden;

}



.entry-header .meta-post {

  word-break: break-all;

}

 @media only screen and (min-width: 1024px) {
      .site-header .col-md-4 {
        width: 10%;
      }
      .site-header .col-md-8 {
        width: 90%;
      }
    }

    .site-header .header-wrap .container {

      width: 100%;

    }



    @media only screen and (max-width: 767px) {

      .site-header .header-wrap .col-md-4 {

        display: none;

      }

    }

 @media only screen and (max-width: 1024px) {

      .sydney-hero-area .header-image {

        display: none;

      }

    }

  .preloader {
      display: none !important;
    }
    #mainnav-mobi.mainnav.hidden {

      display: none;

    }
#4

Hi,

Thank you for getting back.

As checked with my phone, your mobile menu is working fine. Here is the screen recording when checking.

https://drive.google.com/file/d/1qQroK9WqfRvVw4QFu7HCVYbP-lZKHB4X/view?usp=sharing

Perhaps you’re having a cache on your web browser that should be flushed. You may need to refresh your web browser before reloading your site.

Regards,
Kharis
aThemes Support

#5

It is not the cache…the mobiele site is no longer responsive

any solutions Kharis?

#6

Hi,

Try adding this CSS code to Appearance > Customize > Additional CSS from dashboard.

    #mainnav-mobi.mainnav.toggled,
    #mainnav-mobi.mainnav.syd-hidden.toggled {
      display: block;
    }

Let me know how it works.
Regards,
Kharis
aThemes Support

#7

Dear Kharis,

Some blocks are still not responsive. I am using an android - I cleared cache.
Also asked other friends.

This is the first time I see some blocks on a page become mobiel friendly while some others are not.
How can I fix it?

#8

Can you take a screen recording for this and share it here to help me be able to get clearer picture?

Regards,
Kharis
aThemes Support

#9

of course,

here is the google drive link:
https://drive.google.com/file/d/1-jtKNyn-d5FxQOKxsWGZcRl1vTlR7C3w/view?usp=sharing

#10

Hi,

Thank you for sharing the video.

Try adding this CSS code to your website’s Additional CSS.

    .container {
      max-width: 100%;
    }

Regards,
Kharis
aThemes Support

#11

Hi Kharis,

Thank you. Now my mobile site is responsive and contained :slight_smile:

1 Like
#12

You’re welcome!

Please let us know in a new topic if you have any further questions, or if we can provide you with any other assistance.

Regards,
Kharis
aThemes Support