divi-accessibility icon indicating copy to clipboard operation
divi-accessibility copied to clipboard

Tab through Divi Mega Menu closes on second column first sub-item

Open ramseyba opened this issue 3 years ago • 6 comments

Tab through Divi Mega Menu, and it closes prematurely on the second column first sub-item.

If you need a link, can I send it privately?

Thanks!

Divi Accessibility - keyboard tab divi mega menu premature close

ramseyba avatar Jul 28 '21 02:07 ramseyba

Lasts versions of Divi hide the submenu when you change the focus to another parent level that has no other submenu inside using tab key navigation.

I´m triying this but it doesn´t work. Mi knoweledge of CSS is poor. :)

.menu-item li > ul.sub-menu { display: none; } .menu-item li:hover > ul.sub-menu { display: block; } .menu-item li a:focus + ul.sub-menu { display: block; }

soleto avatar Oct 21 '21 12:10 soleto

I solve it with this code:

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

soleto avatar Oct 21 '21 16:10 soleto

Have you solved it?

soleto avatar Oct 22 '21 19:10 soleto

Just want to make sure I comment on this as it's still an issue that pops up but Soleto's CSS tweak solves this and just saved me a bunch of time

ceswebmaster avatar Feb 17 '22 14:02 ceswebmaster

Nice to hear that @ceswebmaster

soleto avatar Mar 22 '22 09:03 soleto

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

This code works perfectly for my other issue #87
I'm now able to tab through using the Menu Module in the Theme Builder. Thank you!

christinagwira avatar Sep 25 '23 19:09 christinagwira