How to reduce the size (top to bottom) of the main menu bar?

Hi there,

Thanks for writing in, besides the URL is not available, would you mind sharing some screenshots of thick menu, so I provide you a possible code solution to suppress that padding over menu items.

Thanks.

Hi emranemranx,

I hope I gave you a screen shot of my home page with the menu.
Thanks!
michellenoco

Well, that didn’t go quite right. Still, I think it’s there somehow. Let me know if it’s not. Sorry!

did you figure out how to do this? i would like to make my menu bar thinner as well.

Hi michellenoco,

If you wish to reduce the size of your main menu, so you can achieve that by adding the following code under your Appearance > Theme Options > custom CSS:

.menu-header {
  height: 61px;
}

@mwelcker Please provide your website URL so we can give you an exact solution to make your menu thinner.

Thanks.

Hi emranemranx,
Thank you! Is there also a way to reduce the ghosted outline of the menu tabs?

https://www.nocotherapy.com/

Hi,

Please try the following in Theme Options-> Custom CSS

ul.nav-menu > li.current-menu-item, ul.nav-menu > li.current-menu-ancestor {
    height: 60px !important;
}

It will reduce the current menu item background shadow.

Thanks!

Thank you for your efforts. I copied this code into my CSS, but it didn’t seem to change anything. I left the new code in there for the time being in case you have a chance to look at it again. Do you have any other ideas?
Thanks!

Please try the following in Theme Options-> Custom CSS:

ul.nav-menu > li.current-menu-item,
ul.nav-menu > li.current-menu-ancestor,
ul.nav-menu > li.current-menu-item:before,
ul.nav-menu > li.current-menu-ancestor:before {
    background: none;
}

Still shadowed. :O(
Thanks for trying, though! I can always keep the menu bar thicker if needed. I do appreciate all the help with the CSS. So interesting. I’m amazed by the collective knowledge out there. I appreciate your time!

Remember you’re using a cache plugin that saves old copies of your website. First clear its cache using a setting in the dashboard and then deactivate it.

Yikes! That’s new language for me! How do I go about doing that, if you have time to educate?

You need to ask your caching plugin developers: https://www.ads-software.com/support/plugin/w3-total-cache#postform

This is what I see on my Dashboard:
“W3 Total Cache: Default settings are in use. The configuration file could not be read or doesn’t exist. Please <save the settings> to create the file.” There is a red bar in front of this statement.
I am familiar with clearing the cache on Internet Explorer, but it appears there are many places to set various levels within W3 (General Settings, Page Cache, Database Cache, Object Cache, Browser Cache). All of the “Enable” boxes are NOT checked (presumably to enable caching?).