html - 无法在父 block 旁边的单独 block 中显示子菜单

Question

我必须创建一个嵌套菜单，但我面临的问题是子菜单仅在创建水平滚动条时显示在父菜单中(滚动到最右边你可以看到子菜单)目前我使用的CSS是

  position: relative;
  list-style: none;
  right: 100%;
  left: auto;
  padding: 10px;
  width: 200px;
  height: 250px;
  overflow-y: scroll;
  display: none;
  text-align: left;
  background-color: #f9f9f9;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);

https://jsfiddle.net/g0kujLqk/

Answer 1

引用此代码:

  #templatemo_menu
{
clear: both;
width: 960px;
height: 50px;
background: url(../images/templatemo_menu_bg.gif) repeat-x;
   }


   #templatemo_menu ul li{
text-align: center;
display: inline-block;
position: relative;
}

#templatemo_menu ul ul 
{
display: none;
position:absolute;
}

#templatemo_menu ul ul ul
{
left:100%;
top :-10px;

}

#templatemo_menu ul li:hover >ul
{
display:block;
padding:0;
margin-top:5px;
}