css - 当 parent 或 child 处于事件状态时出现二级菜单

Question

我希望我的子菜单项在父级处于事件状态并且当前菜单或该父级的任何其他子级在我的 wordpress 网站上处于事件状态时显示。我知道这两个 child 会在 parent 处于事件状态时出现，但是当您单击其中任何一个 child 时他们就会消失

示例:https://vfcasino.com/dining/fine-dining/

当您进入美食页面时，Viviano 和 Pacific Prime 会出现，但当您单击父页面时，它们就会消失。如果您在 Casual Dining 或 Bars & Lounges，我不希望它们出现。我希望它们出现在 Fine Dining、Viviano 或 Pacific Prime 上。

这是我使用的 CSS:

#sidebar .widget.widget_nav_menu ul li ul{
display:none;	
}

#sidebar .widget.widget_nav_menu li.current_page_item > ul, 
#sidebar .widget_nav_menu li.current-menu-ancestor > ul ,
.widget.widget_nav_menu li.current_page_item > ul,
.widget_nav_menu li.current-menu-ancestor > ul
{display:block; padding-left:20px; padding-bottom: 10px;}

我试过操纵 css，但就是无法让它工作。

Answer 1

如果我理解正确，这应该可以工作:

#sidebar .widget_nav_menu .current-page-ancestor > .sub-menu {
display: block;
padding-left: 20px;
padding-bottom: 10px;
}

您只需要用更精确的子菜单选择器覆盖此选择器:

#sidebar .widget.widget_nav_menu ul li ul {
display: none;
}