多层下拉菜单中的水平滚动（css）

我有一个多下拉菜单，在CSS中有几个层，还有一个用于较长部分的垂直滚动。问题是，当我将一部分悬停在子菜单中并指向另一个子菜单时，新子菜单被限制在由第一个子菜单及其溢出创建的框中，您必须水平滚动以查看新子菜单，而不是显示在旧子菜单旁边。如何在第一个框的外面而不是里面创建一个新框，这样当我有几个子菜单和子菜单时就不必水平滚动了

这是控制所有子菜单外观的部分代码的简化版本：

#navbar li ul { 
  display: none;
  max-height:800px;
  overflow-y:auto;
  min-width: 160px;
  max-width:auto;
  }

这是控制悬停元素时显示更多子菜单的代码：

#navbar li:hover ul, #navbar li.hover ul { 
 display: block;
 position: absolute;
 margin: 0;
 padding: 0;
 z-index: 20000;
 -o-transition: all 1.7s ease-out 1s;
 -webkit-transition: all 1.7s ease-out 1s;
 -moz-transition: all 1.7s ease-out 1s;
}

---

您能提供您的代码的简化版本吗？好的，我现在添加了一些代码，与此问题相关的部分=父li，即导航栏li，必须有溢出：自动设置，删除它。但是垂直滚动不也会消失吗？我想保留的那一个。你的代码中的一部分可能会有所帮助。