内部div悬停时如何影响其他元素

Question

如果悬停了菜单移动按钮，我想显示右导航栏。我尝试了各种选项，但没有任何作用。

<div class="header">
<div class="menu-mobile-button">
  <h4>Show content</h4>
</div>
</div>


<div class="container-grid">
  <div class="right-nav">
    <p>Hello World</p>
  </div>
</div

我尝试过：

 .right-nav{
  display: none;
}

.header > .menu-mobile-button:hover + .container-grid > .right-nav {
  display: block;
}