Responsive Menu Navigation Height too short

  • Acal

    (@acal)


    7 years, 3 months ago

    On mobile the menu has a height of 250px which is tall enough for the top level navs. But when you click on a child link the menu height is not recomputed to allow for those links to show beyond the 250px restriction. It is really tricky to override with CSS due to what I believe is the js computing the height. Any hacks I could add to my child theme or other suggestions? Thanks!

    This is where I see the 250px height.
    <div id="header-responsive-inner" class="responsive-links nav-collapse in collapse" aria-expanded="false" style="height: 250px;">

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)
  • Anonymous User 16453565

    (@anonymized-16453565)

    7 years, 3 months ago

    Hey, @acal

    To do that, go to Appearance → Customize → Additional CSS and enter the following code:

    @media only screen and (max-width: 768px) {
  #header-responsive-inner {
    height: 100% !important;
  }
}

    Let me know if that does it.
    Thank you.

    Thread Starter Acal

    (@acal)

    7 years, 3 months ago

    Thanks @snehalb890 for trying but I tried that already. I tried again with your exact css and same problem as before. What happens is that the responsive menu is always open (not collapsed)starting with page load. Even clicking the hamburger icon won’t close the menu when that css is used. It does fix the height issue but creates a new problem. I think overriding some js might be needed. Any additional ideas are welcome.

    Thread Starter Acal

    (@acal)

    7 years, 3 months ago

    Any other thoughts @snehalb890 ?

Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Responsive Menu Navigation Height too short’ is closed to new replies.