This week i published my new redesign website in WordPress with Theme X, it looks great.
But when i test it on several devices i see that my iPad is not responce as i expected.
In landscape it’s fine but not it’s in portrait.

It shows my mobile menu when there is enough room to show entire navbar menu, i’am using the stack Renew.
What can i do to fix this problem, is the solution to add an css media query.

My website is http://www.alzheimermuziekgeluk.nl

Looking forward to your wise advice to solve this.

Kinds Regards
Ignar Rip

I’ve look into to your site and created a series of screenshots.

ipad mini: http://prntscr.com/66xibp
ipad 3: http://prntscr.com/66xig0
Android: http://prntscr.com/66xigi
iphone4s: http://prntscr.com/66xlxp
iphone5s: http://prntscr.com/66xl5p

It looks okay on my end. Would you mind taking a screenshot for me so that I can investigate further?

Please let us know

Thank you for taking time to look at our website, it stills looks not good.

Landscape on my iPad Air2 is Good, looking at the Navbar menu on Portrait it’s not good. With previous website there was no problem to show all menu items of the menu.

Here are my two screenshots : Landscape and Portrait.

Thank you for time and answer

Ignar Rip

Thanks for updating the thread!You can add this under Custom > CSS in the Customizer or in your child theme’s style.css file.

@media (max-width: 979px) {

    a.x-btn-navbar.collapsed {
        display: none;
    }

    nav.x-nav-wrap.desktop {
        display: block;
    }
        nav.x-nav-wrap.desktop li a span {
        display: block;
    }
    
    .x-navbar .desktop .x-nav>li>a {
        padding: 0.575em 0.4em 0.525em;
    }
}

Let us know how that goes. Hope this helps – thanks!

Yes it looks much better, only one thing to make it perfect. When i scroll the page the menu in Portrait mode on my iPad is not Sticky. In landscape the navbar is Sticky when i scroll down through the page.

Can i make it sticky on Portrait and how ??

Thank you for time

Kind Regards

Ignar Rip
from Netherlands

To make it sticky, you can add this under Custom > CSS in the Customizer.

@media (max-width: 979px){
body .x-navbar.x-navbar-fixed-top{
     position:fixed;
}
}

Hope that helps.

Thank you, it works the Navbar is Sticky again on the iPad on Portrait mode.

Have an nice Weekend

Ignar Rip

With the latest version of Theme X, i have again problems with my Sticky Navbar in Portrait mode.
Look at my website http://www.alzheimermuziekgeluk.nl on your iPad.

My SideMax Width is 970.

Adding this CSS Code

@media (min-width: 767px) {
.x-navbar-fixed-top {
position: fixed !important;
}
}

The Web and my Landscape on my iPad works fine and the NavBar is Sticky.
On my Portrait mode on my iPad it goes to Mobile Menu

Grrr

Please help me, i hope this is simple coding for you guys.

Looking forward to your answer.

Kind Regards,

Ignar

Kind Regards
Ignar