Не могу разместить псевдоэлемент на фоне - PullRequest
Новая
       26

Не могу разместить псевдоэлемент на фоне

0 голосов
/ 26 декабря 2018

Это мой код: 

#topcmm-123flashchat-side-userlist-inner {background-color:blue;z-index:1;position:relative;}
#topcmm-123flashchat-side-userlist-inner, #topcmm-123flashchat-side-userlist-inner::before, #topcmm-123flashchat-side-userlist-inner::after {
 clip-path:polygon(8.03% 2%, 21.81% 2%, 26.77% 4.41%, 56.94% 4.41%, 60.63% 2%, 93.14% 2%, 98.85% 6.08%, 99.07% 87.01%, 94.28% 90.46%, 93.21% 97.43%, 55.48% 97.43%, 51.93% 99.00%, 26.95% 99%, 23.22% 97.31%, 6.93% 97.34%, 6.93% 89.43%, 3% 86.19%, 3% 6.36%);
}
#topcmm-123flashchat-side-userlist-inner::before, #topcmm-123flashchat-side-userlist-inner::after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
 top:0;
    transform-origin:right;
}
#topcmm-123flashchat-side-userlist-inner::before {
    background-color: #80808033;
    transform: scale(1.02);z-index:-1;
}
#topcmm-123flashchat-side-userlist-inner::after {background-color:black;transform:scale(1.03);z-index:-2;}

html 

<div id="topcmm-123flashchat-side-userlist-inner">
shit
</div>

https://jsfiddle.net/kvd2ucwm/

Псевдоэлементы должны отображаться на фоне, но они продолжают показыватьсяна переднем плане, несмотря на то, что я устанавливаю их z-index на отрицательные значения.В чем дело?Пожалуйста, помогите мне решить эту проблему, это сводит меня с ума.

Спасибо.

...