Archived topic

Nav Drop down radius corners - Hover state

3 replies · Started by Paul on November 14, 2022

Viewing posts 1–4 of 4

November 14, 2022 at 5:03 am #2414695

Hi There,

I added this CSS for radius corners on a nav dropdown:

.main-navigation .sub-menu {
border-radius:20px;
box-shadow: 0px 0px 20px 0px rgba(26,32,61,.3);
}

Which works apart from on hover the radius is hidden on first and last items - Can you help? Please see link in the Private info.

Cheers
Paul

November 14, 2022 at 5:27 am #2414727

Hi there,

I assume there is no sub-sub-menus?
IF so you can hide the overflow - change the CSS to this:


.main-navigation .sub-menu {
    border-radius: 20px;
    box-shadow: 0px 0px 20px 0px rgba(26,32,61,.3);
    overflow: hidden !important;
}

November 14, 2022 at 5:51 am #2414748

Hi David,

Hope things are going well with you!

No, no sub-sub menus.

Works perfectly.

Thank you - GeneratePress support is awesome! :)

Paul

November 14, 2022 at 6:40 am #2414801

Very well thanks Paul :)
Glad to be of help

This archived topic is closed to new replies.