我希望它像这样:
当前情况如下:
因此,如图所示,大多数背景都以白色突出显示,但是左右两侧都有一个紫色的小区域。
到目前为止,我与菜单项相对应的代码为:
.collapsible-menu ul
li:hover:not(:last-child) {
background-color:white;
width:100%;
color: #4C27B3;
text-decoration: none;
outline:none;
}
这可能是一个快速解决方案,但我需要再双眼才能找出问题所在。预先非常感谢。
所有代码都可以在此处查看:
答案 0 :(得分:0)
在CSS中
.menu-content{
overflow: hidden;
font-family: 'Raleway', sans-serif;
font-weight: bold;
padding: 0 0 0 50px;
/* add this margin left & right to make hover white full screen*/
margin-left: -79px;
margin-right: -30px;
}
答案 1 :(得分:0)
在CSS
.collapsible-menu {
background-color: #4C27B3;
border: none;
box-shadow: 1px 2px 3px rgba(0,0,0,0.2);
}
从代码中删除此类的填充