css - 无法获得背景全宽

Question

请参阅此站点http://www.lovinmybags.co/ 主菜单具有此代码的全宽背景

#PrimaryMenu > ul > li.ActivePage > a {
    color: #ffffff;
    font: normal 0.80em Verdana, Verdana, Geneva, sans-serif;
    background-color: #222222;
    font-weight: bold;
}

但是当我对#FooterMenu 使用相同的代码时，免费的地方就很小了。产品页面的背景不活跃。有人可以帮我吗？

Answer 1

在以下 CSS 规则中添加到您的a元素：#FooterMenu

#FooterMenu > ul > li.ActivePage > a { 
   padding: 13px;
   margin: 0;
}

该padding-top值也可以是 14px。你选。

如果您想在访问“产品”页面时看到“产品”项处于活动状态，则只需添加.ActivePage到li元素中。请参阅以下代码：

<!-- The rest of your content -->
    <li class="HasSubMenu ActivePage">
     <a href="/categories.php"><span>Products</span></a>
<!-- The rest of your content -->

请注意，您必须将.ActivePage类添加到li#FooterMenu 元素内部！

干杯，莱昂纳多

Answer 2

#PrimaryMenu > ul > li.ActivePage > a:hover {
color: #ffffff;
font: normal 0.80em Verdana, Verdana, Geneva, sans-serif;
background-color: #222222;
font-weight: bold;
padding-bottom: 13px; /*New*/

}