CSS：如何使文本周围的背景色不与文本齐平？

我是新的CSS和网站设计。请参见本页左侧的菜单： 当您将鼠标悬停在菜单元素上时，文本周围的背景将变为白色，但我希望整行以及文本上方和下方的一点也变为白色，类似于顶部菜单。以下是我的代码：

.child-sidebar-menu
{
    background-color: #DEDEDE;
}

.advanced-sidebar-menu ul li a{

text-decoration: none;
color: black;
border-bottom: 0px;
}

.advanced-sidebar-menu ul li a:hover{
text-decoration: none;
border-bottom: 0px;
}

.advanced-sidebar-menu li > ul li a:hover
 {
   color: black;
background-color: white;
 }

.advanced-sidebar-menu ul ul li a{
font-weight: normal;
font-size: 100%;
border-bottom: 0px;
}

.advanced-sidebar-menu ul{
margin: 0 0 0 0px;
list-style: none;
list-style-type: none;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
border-bottom: 0px;
line-height: 200%;
}

.advanced-sidebar-menu ul li{
    list-style:none;
    list-style-type: none;
border-bottom: 0px;


}

.advanced-sidebar-menu li.current_page_item{

    list-style-type: none;
border-bottom: 0px;
}

.advanced-sidebar-menu li.current_page_item a{
    font-weight: bold;
border-bottom: 0px;
}

有什么简单的方法吗？这与边界和边界有关吗

---

谢谢。

我试着玩了你的网站，并想出了这个我希望这就是你想要的。换衣服

.advanced-sidebar-menu li > ul li a:hover
 {
   color: black;
background-color: white;
 }

到

检查此JSFIDLE：

重点是：

使

标记

显示：块

。这将允许

像

li

从

中删除

填充

和

边距

。相反，给

同样的值

---

谢谢我和你一样做了，它改进了很多，但是悬停背景色和常规背景色之间仍然有一些差距。右边没有间隙。这是因为另一个

ul

标签中有

ul

标签。默认情况下，

ul

将在左侧有一些边距。我们能做的是，我们把

ul

标签左边的边距设为0。并在嵌套的

ul

中为

a

标记添加一些左填充。这将显示缩进的子菜单，并使背景色占据整个宽度。需要演示吗？让我知道。我更新了代码，以演示具有正确悬停背景的子菜单。检查并让我知道它是否需要任何修改。嘿。谢谢你的帮助。我在这一页上实现了您的最后一个JSFIDLE：但问题仍然存在。我根据您的代码复制了我在JSFIDLE上实现的代码，并且它可以正常工作。你知道为什么左边的空白在wordpress上实现时仍然存在吗？

.advanced-sidebar-menu li > ul li:hover
 {
   color: black;
background-color: white;
 }