单个菜单项的 CSS 样式

Question

在这个网站上：https://new.fbhsfoundation.com/give-now/ 我已经想出了如何为单个导航添加自定义样式，但我想让背景围绕文本（即黄色的左右填充更多）但我可以'想不通。

这是我尝试的代码，然后将自定义 CSS 应用到菜单项，但它只做背景颜色而不是填充：

.yellow li.menu-item a { padding 5px; }

Answer 1

查找并删除 .menu li 的填充属性，并为 .yellow 类添加填充样式。

.menu li{
    min-width: 36px;
    margin: 0 12px;
    /*padding: 0*/
}

.yellow{
    background-color: #ffe400;
    padding: 0 20px;
}

或者更好的是，使用列表元素 (li) 的 id 来添加填充样式。

li#menu-item-46{
    padding: 0 10px;
}

Answer 2

使用 12 像素的内边距代替 12 像素的边距。

.menu li {
    min-width: 36px;
    margin: 0px;
    padding: 0px 12px;
}