michel lompret michel lompret - 19 days ago 6
CSS Question

background-color over on background-image

I try to add opacity transition on three div with background-image but the opacity have effect on h4 title so i use background-color rgba but the problem is that it doesn't appear over image.


I think I found a solution for what you want, but I came to it with a lot of tweaking:


(note: I only applied it to the element in the middle)

The most important change is that I put the background-images into the CSS stylesheet (not inline style), and as background property. Also the background color (applied to .promo-overlay) I defined as background- that way two the backgrounds can be combined. For more details see the codepen.