Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
  • #219288


    I disabled the responsive layout in the theme options. The page looks at first sight on mobile devices ok. But when I try to zoom the page, it shifts the header navigation (main menu) or it disappears completely (tested on ipad, samsung note 2).

    Can you please give me some advise?

    Best regards,



    Hey AdDesign!

    Can you post the link to your website so we can take a look?



    I’ll post mine, as I have the same issue:


    oh, and for me, i have not modified the stock field value regarding responsive. i also am not doing anything with zoom level in either safari or chrome for the iphone 4s with iOS 7, yet i am missing header nav and slideshow.

    WP 3.8.1
    Enfold 2.4.5

    This reply has been marked as private.


    Have you tried adding this on Quick CSS?

    @media only screen and (max-width: 989px) {
    #mobile-advanced, .mobile_active.mobile_menu_tablet #advanced_menu_toggle {
    display: block;



    Added that, but if you look at the CSS generated, the @media block is showing up after some other css in the same HTML block. I thought that @ directives need to be at the top to have an effect. or maybe that’s just @import. i don’t know, but either way, it didn’t affect it on my mobile device. Here’s the CSS that was generated, yet I only pasted what you sent me into the box. the above stuff is coming from somewhere else.

    <style type="text/css" media="screen">
    	html { margin-top: 32px !important; }
    	* html body { margin-top: 32px !important; }
    	@media screen and ( max-width: 782px ) {
    		html { margin-top: 46px !important; }
    		* html body { margin-top: 46px !important; }

    FYI tried adding it to custom.css since I found an @media thing ready to go. Change took, but no diff on mobile:



    Try this:

    @media only screen and (max-width: 989px) and (min-width: 768px) {
      .responsive .mobile_menu_tablet .main_menu {
      display: block;

    We’ll need to adjust the theme for the next update as its a bug but this should be a quick-fix.



    Hi Devin,

    I’ve tried the recommended CSS’s but unfortunately both don’t work.




    Same here – no change. Is there a plugin for chrome for iPhone to inspect the element and see what styles are operative?


    @jrevillini – can you try refreshing a few times. Seems to have fixed it when viewing on my end.

    @addesign – Looks fixed on my end as well though the menu is now overlapping so changing the switch width with this tut should help you (increase the pixel width at which the nav menu switches): (Purchase code hidden if logged out) /



    Javascript error that was only triggered in iOS Webkit.

    I believe it’s still true that Chrome and Safari on iOS are Webkit-based, even though Chrome went to it’s own base some time ago on other platforms.

    So in my case, I had some jQuery javascript which was causing only an error on iOS webkit browsers. The desktop browsers must be more forgiving. The bad code was a selector. I had

    $('head link[id^=pau').appendTo('head'); // note the missing close bracket in the attribute selector

    Shoulda been

    $('head link[id^=pau]').appendTo('head'); //happy

    So the only way for me to debug it was by following these instructions to enable web inspector for Safari on iOS:

    I’d start by making sure any site with this issue has no JS errors ON THE DEVICE, since that’s going to impact the slideshow and nav.

    • This reply was modified 3 years, 10 months ago by  jrevillini. Reason: adding formatting

    Glad you were able to figure that out :)

Viewing 14 posts - 1 through 14 (of 14 total)

You must be logged in to reply to this topic.