Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • January 18, 2018 at 6:19 pm #899234
    brianwelsh

    Hi,

    I have a staging site that I am developing and everything is fine but I have had a comment that the header does not display well on a
    an ipad. I have checked and the logo on the left and the associated text gets cut of on a few devices.

    Is there anything I can do to make that area more responsive?

    Home

    Thanks,
    Brian

    January 18, 2018 at 6:42 pm #899245
    Jordan Shannon

    Hey brianwelsh,

    Please refer to the following:

    Switching to mobile menu on higher resolutions

    Best regards,
    Jordan Shannon

    January 18, 2018 at 7:21 pm #899259
    brianwelsh

    Hi Jordan,

    Thanks for this! The only problem is the menu disappears when I add the code? The logo however is in full.

    Bit weird – Portrait is is fine but landscape it disappears?

    http://whatismyscreenresolution.net/multi-screen-test?site-url=http://stvincentsalt.wpengine.com/&w=768&h=1024 (hosted on WPengine)

    Kind regards,
    Brian

    • This reply was modified 6 years, 3 months ago by brianwelsh.
    January 18, 2018 at 7:46 pm #899276
    Jordan Shannon

    Hi,

    Are you using the latest version of Enfold? Try the following:

    @media only screen and (max-width: 1024px) {
  nav.main_menu {
    display: block !important;
  }
  #avia-menu .menu-item {
    display: none;
  }
  .av-burger-menu-main.menu-item-avia-special {
    display: block;
  }
}

    Best regards,
    Jordan Shannon

    January 18, 2018 at 9:33 pm #899308
    brianwelsh

    Hi,

    Getting there but not quite right!

    I have updated the theme and the mobile icon is shown now but when I click on it, it displays a weird transparent menu in blue text down the right hand side of the screen?

    You can see it here:

    http://whatismyscreenresolution.net/multi-screen-test?site-url=http://stvincentsalt.wpengine.com/&w=768&h=1024 (hosted on WPengine)

    Doing that on all the other devices now with the mobile menu.

    Sorry,
    Brian

    • This reply was modified 6 years, 3 months ago by brianwelsh.
    January 18, 2018 at 9:43 pm #899313
    brianwelsh

    OK,

    I tried this:

    @media only screen and (max-width: 1024px) {
    .av-main-nav > li.menu-item-avia-special {
    display: block;
    }
    .av-main-nav > li.menu-item {
    display: none;
    }}

    I thought it worked but it doesn’t work on a mobile now!

    Thanks,
    Brian

    • This reply was modified 6 years, 3 months ago by brianwelsh.
    January 19, 2018 at 12:26 am #899373
    brianwelsh

    Any more thoughts on this?

    January 19, 2018 at 11:09 am #899583
    brianwelsh

    Hi,

    Is it possible to change the activation of the Mobile Menu being used from 990px wide to 1025px wide. This would take in an iPad tablet being used in a Landscape view. It presently only works in Portrait.

    Thanks,
    Brian

    January 19, 2018 at 12:02 pm #899616
    Victoria

    Hi Brian,

    Yes, it is possible. Which version of the theme are you using? Can you give us temporary admin access to your website in the private content box below, so that we can have a closer look?

    Best regards,
    Victoria

    January 19, 2018 at 12:15 pm #899629
    brianwelsh

    Hi Victoria,

    Login in private.

    Thanks,
    Brian

    • This reply was modified 6 years, 3 months ago by Rikard.
    January 19, 2018 at 2:35 pm #899709
    brianwelsh

    Hi,

    I have noticed there is a mobile menu showing up when I view the site on my desktop computer now? Are you still working on it?

    Thanks,
    Brian

    • This reply was modified 6 years, 3 months ago by brianwelsh.
    January 21, 2018 at 4:37 am #900252
    Rikard

    Hi Brian,

    I can’t see that the mobile menu is active on desktop, it switches at 990 pixels on my end. Is that the way you want it or do you want to change that?

    Best regards,
    Rikard

  • Author
    Posts
Viewing 12 posts - 1 through 12 (of 12 total)
  • You must be logged in to reply to this topic.