Show Grandchild/Child Menus On Hover

Good Morning Rita,

This may be achieved by adding the following custom CSS:

.grandchild-sidebar-menu { top: 3px; left: 105%; margin: 50px; display: none; position: absolute; min-width: 100%; z-index: 1; background-color: #E5EAEE; width: auto !important; } .grandchild-sidebar-menu li { width: auto !important; float: none; } .grandchild-sidebar-menu a { color: #000 !important; white-space: nowrap; font-weight: 700; padding: 7px 10px; } .grandchild-sidebar-menu li:hover { background-color: #B61311; } .grandchild-sidebar-menu li:hover a { color: #FADCDB !important; } .child-sidebar-menu .has_children { position: relative; } .child-sidebar-menu .has_children:before { content: '>'; position: absolute; right: -10px; } .child-sidebar-menu .has_children:hover > ul { display: block; } .child-sidebar-menu .has_children a { color: #fff; } 

Also I recommend checking the option labeled “Always display child pages” to use along with this CSS.

Have a great day!

Mat Lipe