Красная полоска должна быть ЗА изображением, а сейчас она на нём:
https://jsfiddle.net/tm6Lqh3u/
#footer_wrap_bg {
position: absolute;
z-index: 1;
background: url('https://evve.link/fl/images/footer_bg.png') no-repeat;
width: 100%;
height: 360px;
}
#footer_wrap_bg_colorizer2 {
position: absolute;
z-index: 0;
background: red;
width: 100%;
height: 15px;
margin-top: 55px;
}
<div id="footer_wrap_bg"></div>
<div id="footer_wrap_bg_colorizer2"></div>
Если же не использовать изображение в background, то всё нормально, красная полоска становится ЗА изображением.
https://jsfiddle.net/tm6Lqh3u/1/
#footer_wrap_bg {
position: absolute;
z-index: 1;
background: green;
width: 100px;
height: 360px;
}
#footer_wrap_bg_colorizer2 {
position: absolute;
z-index: 0;
background: red;
width: 100%;
height: 15px;
margin-top: 55px;
}
<div id="footer_wrap_bg"></div>
<div id="footer_wrap_bg_colorizer2"></div>
Как быть?