Menu and Page Title Overlapping Mobile

  • Hi!

    I have experienced quite an important problem while testing the theme and will be glad to receive your help on this.

    First of all I should mention that I use transparent header and transparent menu as well. So, when I open any page on mobile it looks like this: https://oi66.tinypic.com/k9gkqq.jpg

    But when I click to expand menu it overlaps the title of the page! So the outcome isn’t quite beautiful to be fair: https://oi67.tinypic.com/357h65l.jpg

    By the way, space between the logo and elements of the menu is too big as well – I’ll be grateful for your help with its reducing.

    So, due to such a situation if I want to evade overlapping I need to do something like this at the moment: https://oi65.tinypic.com/i25bv7.jpg. When I expand menu it doesn’t overlap page title – this obviuosly is not the solution though.

    Thank you for the amazing theme and for the help. You’re doing great job!

    Best regards!

Viewing 11 replies - 1 through 11 (of 11 total)
  • hannah

    (@hannahritner)

    Hi!
    Sorry for the delay! Are you able to post an actual link to your site? That would make it easier to provide correct css.
    Thanks,
    Hannah

    Thread Starter allsmilesby

    (@allsmilesby)

    Hi, Hannah!

    Sure, I can. Here is the link: https://allsmiles.by/

    Big thank you in advance for your help!

    Best regards!

    Hey,
    So the mobile menu when expanded is supposed to sit above the page title. If you just set the mobile menu background to black. (theme options > advanced styling) that should make this better so that it’s the focus when open and you can close to see the page title and they won’t overlap.

    Kadence Themes

    Thread Starter allsmilesby

    (@allsmilesby)

    Hi!

    Yes, I understand that menu won’t overlap page title if background is coloured but is there any chance of the same thing with transparent background or it’s impossible to do?

    Big thank you for your help!

    hannah

    (@hannahritner)

    There isn’t a built in option for this. Sorry!

    Hey sorry for the delay. I’m still confused I guess. What are you hoping for if you don’t give the menu a background so you can see it. The header is absolutely positioned so it can’t have an impact on the position of the page title.

    You can bring the mobile menu higher by adding this css:

    .kad-nav-inner .kad-mnav {
    padding-top: 0;
}

    Kadence Themes

    Thread Starter allsmilesby

    (@allsmilesby)

    Thank you for the help! I will certainly see into this ??

    By the way, is it possible to hide menu on mobile devices? I’ve tried the following variant:

    .kad-nav-inner .kad-mnav {
display: none;
}

    But three lines are still displayed at the right side. Can they be hidden?

    Thanks and best regards!

    hannah

    (@hannahritner)

    This css should do it:

    .nav-trigger-case .kad-navbtn i {
    display: none;
}

    Hannah

    Thread Starter allsmilesby

    (@allsmilesby)

    Thanks, Hannah! It works!

    antoinettegoosen

    (@antoinettegoosen)

    Hi,

    I have a similar problem on my site and also only on mobile. My site is https://www.shapeshiftdecor.com

    The menu and widgets buttons are obscured by the Site Name.

    I am a bit of a novice, so please point me to where on the Dashboard I should insert any code if possible.

    Many thanks in advance.

    Antoinette

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    @antoinettegoosen, You’re using a custom theme, not the Pinnacle theme that is being discussed here. You should create a new thread and ask for support in the Troubleshooting forum: https://www.ads-software.com/support/forum/how-to-and-troubleshooting#postform

Viewing 11 replies - 1 through 11 (of 11 total)
  • The topic ‘Menu and Page Title Overlapping Mobile’ is closed to new replies.