CSS Div overlaps text

try give relative position to <a> or <li> and absolute position to <span>, than z-index will be working

   <li class="nav-item p-1" style="position:relative;">
    <a class="nav-link" routerLink="overview/cases" routerLinkActive="active-link" (click)="collapsed=true">Cases
     <span class="new-feature" style="position:absolute;top:0;left:0;">NEW</span>
    </a>
   </li>