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]

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

  • 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.

    Thread Starter mscareergirl

    (@mscareergirl)

    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?

    Thread Starter mscareergirl

    (@mscareergirl)

    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!

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Submenu positioning and style’ is closed to new replies.