Image blend test 2

by trolleymusic

HTML

<div class="red">
<img src="http://localhost/assets/cms_img/video_alistair-amanda.jpg">
</div>

<div class="yellow">
<img src="http://localhost/assets/cms_img/video_car.jpg">
</div>

<div>
<img src="http://localhost/assets/cms_img/video_alistair-amanda.jpg">
</div>

CSS

div {
 display: block;
position: relative;
 margin: 10px;   
}
div img {
    position: relative;
    display: block;    
}
div:after {
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    content: '';
}

div.yellow:after {
                    background: rgba(255, 207, 1, 0.2);
}
div.red:after {
                    background: rgba(130, 0, 83, 0.4);
}