导航子菜单显示不正确

Question

因此，我正在为一个学校项目开发一个小型惠普，并且有点卡在导航栏中。当我将鼠标悬停在“图库”上时，子菜单打开，出现问题： 我尝试着尝试，但似乎无法找到一种方法来获取仅用于子菜单区域的背景色，而不是左侧的整个页面。 ..

我敢肯定，这是一个简单的办法，但我奋力ATM

这里的的jsfiddle： https://jsfiddle.net/67wq84g9

我觉得这里的东西，但如果我更改宽度和悬停在子菜单它不会完全改变颜色。

.menu ul { 
    display: none; 
    width: 100%; 
} 

有什么想法吗？

Answer 1

你能设置

.menu ul { 
    list-style: none; 
    background: #7ebc71; 
    padding: 0; 
    position: absolute; 
    top: 100%; 
    width:80px; 
} 

，并且解决了由于问题

.menu ul li a:hover { 
    background: #557F4C; 
    width :80px; 
}