鼠标悬停在div上不会改变颜色(Mouseover on div won't change color)

 我在这个网站上工作，我无法在鼠标悬停时更改菜单按钮。 我目前有这个div我想要鼠标悬停： 
 
<a href="/index.html"><div class="e" id="menu-button"><p id="menu-text">Home</p></div></a>
 
 类e和ID绑定到此css： 
 
#menu-button {
   background-color: azure;
     color: black;
    height: 3.5vw;
    width: 23%;
    margin-left: 2%;
    color: black;
    magin-top: 2%;
    float: left;

}

.e:hover {
    background-color: blue;
}
 
 在“鼠标悬停”或“悬停”事件中，按钮根本不会更改。 提前致谢！ 

I'm working on this website and I'm not able to change the menu button on mouseover. I currently have this div I want to have the mouseover on:
 
<a href="/index.html"><div class="e" id="menu-button"><p id="menu-text">Home</p></div></a>
 
Class e and the ID are bound to this css:
 
#menu-button {
   background-color: azure;
     color: black;
    height: 3.5vw;
    width: 23%;
    margin-left: 2%;
    color: black;
    magin-top: 2%;
    float: left;

}

.e:hover {
    background-color: blue;
}
 
On the 'mouseover' or 'hover' event, the button doesn't change at all. Thanks in advance!

原文：https://stackoverflow.com/questions/32310327