意外的滚动条：溢出和滚动，绝对div与：悬停

Question

我正在尝试构建一个纯css鼠标悬停菜单，其中DIV出现在悬停的项目的右侧。基本思路是使用DIV

上显示的绝对定位:hover

它看起来像这样（用于调试目的的颜色）

结果

相关CSS

.hoverDiv:hover .hoverItem
{
  background-color: green;
}
.hoverDiv:hover .hoverMenu
{
  display:inline-block;  
}
.hoverMenu
{
  display:none;
  position: absolute;
  background-color: green;
  left:100%;
  top:0px;
}

这很有效。但是，如果项目太多，我希望有一个（垂直）滚动条。但是当我添加overflow-y:scroll时，悬停效果也会触发水平滚动条。

请参阅https://jsfiddle.net/g2g1zutb/12/，红色部分为'错误'，黄色部分正常，但没有滚动。

解决这个问题的最佳方法是什么？它只能在CSS中使用吗？