Can't tab through to dropdown menu when using Menu Modules and the Divi Theme Builder

[christinagwira]

Hi everyone! Hope all are well. I think I've discovered a bug when using the Menu Module in the Divi Theme Builder. Here are two websites:

1. https://utm.noyadesigns.com - This uses the default Divi menu. Keyboard tabbing through to a submenu works
2. https://blackutm.noyadesigns.com - This uses a Menu Module within the Divi Theme Builder. You are unable to tab through to submenus/dropdowns using the keyboard

Looking for a workaround, would it be wise to assign the CSS class name of the standard Divi menu to the Menu Module in the Theme Builder? How can we get it so that when a menu module is used in the Global Default Template, or any template within the Divi Theme Builder, we can still use TAB + SHIFT to use the keyboard to navigate through the menu?

Thank you for your time and looking forward to seeing this fixed.

[christinagwira]

This CSS code from #53 fixes this issue:

li:focus-within > ul { opacity: 1; visibility: visible; } .menu-item li a:focus { display: block; }

Not sure how this will work with multicolumn dropdowns, but for single-column dropdowns, adding this CSS to your Theme Builder allows you to TAB and TAB + SHIFT through your Menu Module