Зиндекс не срабатывает для стрелки, как спрятать стрелку под блок?

Question

[Антон Вебсайтовский]

Пытаюсь сделать стрелку .arri1::after позади блока .infog>div, чет не вышло.
При наведении на блок, происходит ховер, и стрелку не красиво видно, вот я и пытаюсь ее за блок скрыть, чтоб только кончит торчал который видно, ну или можно чтобы стрелка тож цвет меняла, при наведении на блок, тож чет не вышло сделать так.

Пробовал так:

.infog>div:hover .arri1::after {
border-left: 25px solid #CCBBA0;
}

У стрелки

.arri1 {
    position: relative;
    z-index: 10;
}
.arri1::after{
position: absolute;
z-index: 10;
}

У блока

.infog>div {
position: absolute;
z-index:8100;
}

Рабочий примет тут:
https://codepen.io/AXOT/pen/QWroPoE

Comments

[Максим]

Наверно для after надо absolute

[Антон Вебсайтовский]

Максим с Казахстана, да так и стоит.

[Максим]

Антон Вебсайтовский, весь код приложите, удобнее в codepen, да и стрелочки пора бы в svg делать уже

[Антон Вебсайтовский]

Максим с Казахстана, так яж добавил https://codepen.io/AXOT/pen/QWroPoE

[Антон Вебсайтовский]

Максим с Казахстана, да я то svg использую, то так )

[Максим]

Антон Вебсайтовский, https://codepen.io/topicstarter/pen/jOxJjOK так или нет не знаю -

[Антон Вебсайтовский]

Максим с Казахстана, спасибо, но я немного не про это, я вообщем уже решил.

Answer 1

[Антон Вебсайтовский]

Решение было таким, сделал чтобы стрелка тож цвет меняла, раз уж не удалось ее под блок спрятать.

https://codepen.io/AXOT/pen/QWroPoE