JSFiddle - React, Tailwind, and code Playground

by Lalji Tadhani

HTML

<div class="outter">
    <ul>
    <li>
      <div class="inner">test</div>
    </li>
    </ul>
    </div>

CSS

li{
        position: relative;
        list-style: none;
    }
    .outter{
        background-color: black;
      position: relative;
z-index: -1;
    }
    .inner{
        background-color: yellow;
      z-index: 9;
position: relative;
    }
    .inner:before{
content: '';
position: absolute;
top: 50%;
left: -4em;
width: 12em;
height: 0.2em;
background: white;
z-index: -1;
    }