mobile site header

[mikelynch]

Hi, I am having a few issues with the mobile site.

please see the attached screen grab from my iPhone.

1. The top of the logo and the top of the menu button are cropped at the top.
2. The start of the mobile site is also partially hidden underneath the header.
3. Only one menu is showing – I have a main menu and a top bar menu.

Your help would be greatly appreciated.

Regards
-Mike

Attachments:

You must be logged in to view attached files.

[Mohammad – SUPPORT]

Hi,
Please use this custom css code:-

#logo{
margin-top:0px !important;
}
#header{
height:60px !important;
}

#top-bar .tb-left, #top-bar .tb-right{
display:block;
}

.inner-page-wrap.no-top-spacing{
margin-top:150px !important;
}

Thanks
Mohammad

[mikelynch]

This is now causing the desktop site to have the attached issue with the logo, header and menu items overlapping. The logo is neither in the header, top bar or menu bar and just floating above everything.

I have had to take this off the live site immediately in case it is viewed in this state.

Thanks
Mike

Attachments:

You must be logged in to view attached files.

[Mohammad – SUPPORT]

Hi,
Please remove that code and use this new code:-

@media only screen and (max-width: 767px) {
#logo{
margin-top:0px !important;
}
#header{
height:60px !important;
}

#top-bar .tb-left, #top-bar .tb-right{
display:block;
}

.inner-page-wrap.no-top-spacing{
margin-top:150px !important;
}

}

Thanks
Mohammad

[mikelynch]

Nearly there. However the logo is floating between the header and the body of the site still when viewed on my iPhone. There are both menu’s now appearing but the small menu icon on the right hand side of the header does nothing when it is pressed – it just disappears.

Thanks
Mike

[Mohammad – SUPPORT]

Hi,
Please use this custom css code:-

#logo a.mobile-menu-show:hover {
   color: #fff !important;
}

Thanks
Mohammad

[mikelynch]

Thanks but it doesn’t appear to have made any difference? The menu works from other pages but not the home page and the logo is still hovering between header and the start of the page.

-Mike

[Mohammad – SUPPORT]

Hi,
Please attach marked screenshot so i can get your issue exactly.
Thanks
Mohammad

[mikelynch]

Apologies for the delay in getting back to you. Please see the attached screen grab. The menu ‘floats’ between the header and page on all pages. The menu on the right hand side works on all pages but not the home page.

Thanks
Mike

Attachments:

You must be logged in to view attached files.

[Mohammad – SUPPORT]

Hi,
It seems fine to me. Please check with another device.
Thanks
Mohammad

[mikelynch]

The problem persists on all iPhones that I have checked it on. I will check other devices.

In the mean time, is it possible to have 2 different pages with 2 different menus? Basically, I want the current menu as it is but on another page I would like it in a different language.

Thanks
Mike

[Mohammad – SUPPORT]

Hi,
You can choose different menu to pages through Page meta option below page content editor. Hope it should help to you.

Thanks
Mohammad

[mikelynch]

Thanks for that. However, back to the main point, there is still a major issue on iPhone models in relation to the screen grab I attached. The logo is still floating and the menu on the right hand side does not work.

This is getting pretty critical now and needs to be resolved ASAP.

Thanks
Mike

[mikelynch]

Hi, if you could get back to me on this at your earliest convenience I would be very grateful. I am still having an issue and have attached a screen grab again.

The logo is hovering between the header and the page of the website (it is also stretched) and the menu icon on the right does nothing on the home page – it disappears when pressed. The menu is fine on all other pages except the home page.

Regards
-Mike

Attachments:

You must be logged in to view attached files.

[Mohammad – SUPPORT]

Hi,
I am not getting issue as you explained. I forward this to my colleague so he will assist you now.
Thanks
Mohammad