使用 CSS 覆盖 Bootstrap @media (min-width: 768px) 不起作用

Question

在我网站的导航中，我使用的是引导程序，对于我的活动页面，我试图在其下方添加一条水平线。

对于导航，Bootstrap 已将填充设置为

@media (min-width: 768px)
    navbar.less:286
    .navbar-nav>li>a {
    padding-top: 15px;
    padding-bottom: 15px;
}

我使用border-bottom 作为下方的水平线来显示活动页面，但我不希望它显示在页面标题下方15px。

所以我将此代码插入到我的 custom.css 文件中：

.activeNavPage  {
    border-bottom: solid 1px rgb(255, 95, 0);
    padding-bottom: 10px;
    margin-bottom: 4px;
}

还有：

@media (min-width: 768px)
navbar.less:286
.navbar-nav>li>a {
    padding-top: 15px;
    padding-bottom: 10px;
}

尝试覆盖现有的 boostrap CSS，但我的 @media 查询什么也不做，我的 .activeNavPage CSS 只为边框和边距设置苹果样式，但它也没有覆盖填充。

Answer 1

尝试添加 !important。如 padding-left:10px !important;