为什么:: after选择器在我的代码中无法正常工作？

Question

我将引导程序4用于代码。由于我使用:: after如下

.navbar-light .navbar-nav > li >a::after{
    content: " ";
    height: 50px;
    width: 10%;
    background-image: linear-gradient(to right,#1E8BC3,rgb(162, 214, 240)) !important;
    position: absolute;
    top: 0;
    left: 0;
    z-index:8;
}

背景颜色应显示在所有li> a中，但仅在导航栏的左侧显示，如以下链接中的屏幕截图所示。有人可以提前告诉我解决方案。

Answer 1

将其添加到CSS下方，它将起作用...

.navbar-light .navbar-nav > li {
  position: relative;
}