Submenu positioning and style
-
I am trying to do two things:
1 – move the submenu so it appear directly below the parent menu. Right now it is pushing the submenu all the way below the header image, which looks bad.
2 – In relation to #1, I want the submenu to have the same style as the parent so it looks natural. The submenu typography options don’t all seem to work, so I cannot get it to look the same.
The page I need help with: [log in to see the link]
-
Hello,
1. Add the below css code to the customize > custom css section to fix it –
.sf-menu ul.sub-menu { margin-top: -75px; }2. Have you tried changing the typography settings under Customize > Typography > Main Menu: Dropdowns section? It should work.
That worked for positioning. The typography main menu: dropdowns settings dont seem to work, they don’t do anything, so I had to manually style it using css:
.menu-item a {color: #FFFFFF !important; font-family: Arial, Helvetica, sans-serif !important; font-weight: bold !important; font-size: 13px !important; line-height: 20px}
.menu-item a:hover {color: #8bd1ef !important;}
.menu-item a:active {color: #8bd1ef !important;}One more issue now though – I set the header -> dropdown styling ->background color to transparent, and that works for the menus, but my woocommerce cart drops down as transparent now – how can I force the woocommerce dropdown to remain opaque?
I checked your site but the cart dropdown is not transparent. Have you cleared cache after changing the settings?
I fixed it by changing it back to opaque and adding more custom css to set background color rgba on the non-commerce submenu items
Glad to hear that it is fixed!
The topic ‘Submenu positioning and style’ is closed to new replies.
