How to remove pseudoelement for button links?

Can't remove pseudotag picture for elements with z-index. Maybe there is some way to do without the pseudo-elements?Any method will work!5cf76dec5f23f383167559.jpeg
<div class="header-middle container-inner">
 <div class="promo-setion">
 <div class="promo title">
 <a href="#">Secure Email Communication</a>
 <p>Based in <span>Somewhere</span></p>
</div>
 <div class="account-creation">
 <a href="#">Create account</a>
 <a href="#">Apple</a>
 <a href="#">Coogle Play Store</a>
</div>
</div>
 </div>


.account-creation {
 position: relative;
 display: flex;
 justify-content: center;
 margin-top: 60px;
 z-index: 20;
}

.account creation::before {
 position: absolute;
 content: "";
 width: 602px;
 height: 57px;
 background: url(../img/c-shadow.png);
 background-repeat: no-repeat;
 z-index: 10;
}
March 23rd 20 at 19:08
1 answer
March 23rd 20 at 19:10
Just add z-index to references

.account-creation a {
z-index: 11;
}

https://codepen.io/dmikshin/pen/rgbJdO?editors=1100
why not the block? - friedrich.Heaney commented on March 23rd 20 at 19:13
Now it turns out that you ordered the account-creation z-index and pseudo-element, it turns out that the links are below, because he has not set the z-index

About the job z-index pseudo-elements suggest reading the first link in Google on demand "z-index pseudo-elements" - christian_Dougl commented on March 23rd 20 at 19:16
3dview.png

Here is a visual representation of the z-index may become clearer - christian_Dougl commented on March 23rd 20 at 19:19

Find more questions by tags LayoutHTMLCSS