DUPLICATE: Bricks Nav Menu Element: Overflow hidden behaviour

[davig]

Browser: Chrome 122.0.6261.112
OS: Windows
Video: Jam

I don’t know if this is a bug.

In the Jam video, I have added a submenu to the ‘About’ menu link in the top right. The submenu is given a small border radius for the whole submenu.

Additionally, I added the :hover pseudo-class modifier to the nav menu bricks block and changed the background color of the submenu item to have the individual submenu item’s background change to black. However, as can be seen on hover in the Jam video, the submenu item ignores the parent border radius.

Usually, in plain CSS, the li child in the ul nav menu element would not respect the ul border radius, but this can be handled with overflow: hidden on the ul element. For example: Child Border Overflow hidden • REPL • Svelte

But if I try to add overflow: hidden to the entire submenu using the bricks setting under styles > layout, that just permanently hides the submenu, so no menu appears on hover over the ‘About’ menu link.

I know this can be handled using manual CSS, but it’s sort of unexpected given how the pseudo-class modifier is used on the Nav Menu

[timmse]

Hi davig,
Welcome to the forum!

The problem has already been reported, but it is almost impossible to implement a general solution, as it depends on how many levels your menu has. Since this varies from website to website, the only solution is to use custom CSS as described here by André:

SOLVED: Hover item problem in nav widget (nestable)

Hey @HOSEIN, this is actually harder than I initially thought. The easy fix I was thinking about was to just add an overflow of hidden to the sub menus. But this would break nested sub menus. So at the moment you have the following options: 1. If you have only one level of sub menus you can go the overflow route using some custom CSS: root .sub-menu { overflow: hidden } 2. If you have multiple levels you can do the following: 2a. Set the sub menu’s background-color to transparent. Set the b…

I’ll close the thread since it’s a duplicate.

Best regards,
timmse