Increase mobile menu list height

  • (I’m using a child theme to make my changes.)

    I’m sure this is easy, but I just can’t seem to find the corresponding code! I need to increase the height of each line in the mobile menu (when the screen size is small and the toggle for the navigation appears… the navigation that shows up when you click that). I’m using icons in front of each menu item, which looks great full size, but the icons aren’t resizing in the mobile version, so they get cut off on the list. How do I increase the list items’ spacing so the icons have enough room to appear?

    I can’t post the link just now, but here’s a link to a screenshot so you can hopefully see what I mean: https://snag.gy/asdJc.jpg

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

  • Have you tried something like:

    .primary-navigation.toggled-on .nav-menu li {
   height: 50px;
}

    Thread Starter bluepixeldesign

    (@bluepixeldesign)

    That wasn’t quite it, but it got me a lot closer!! Thanks!!

    I used this:

    .primary-navigation.toggled-on .nav-menu li a {
  height: 40px;
}

    And now the icons are showing. The icons are centered, but the text links align at the top. Any ideas on how to get them centered (off the top)?

    The site is live now, so you can see it at https://www.pacifichepc.org/hepctip/

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Increase mobile menu list height’ is closed to new replies.