Add image but can't get an overlay over the image

When I add a image and want to put a color overlay it doesn’t work.

It only works if I put a div block then I select an image and color in the backgrounds panel.

On it clearly examples add a image then go to background to add an overlay. This does not work for me WTF!? can anyone help me ?

Hi @wildcatwilly Could you please update your post with some more information so we can help you faster?

Which video tutorial are you referring to?

Typically an overlay is applied to a div with a background image (as an “overlay” or gradient is a background-image property and not an overlay per say). Another approach is to add a parent div block with position set to relative (or absolute/fixed as necessary), with an inline image in that div block and then another div block which has a higher z-index and absolute positioning that has the overlay style applied to it but that would be 3 elements instead of one one element.

Things like your read-only link & screenshots really helps us to help you faster.

How to share a read-only link:

Thanks in advance!

Overlays or multiple backgrouds can be added to boxes elements: div, containers, sections etc. An image is just and image, no CSS possibility to add an overlay or layer backgrounds.

To do what you need to do, 2 ways:

make a div box, set dimensions, add image as background and add overlay


make a box, add an image inside add another box inside the first box, set it to position absolute so it’s over the image, add overlay as backgrounds


That’s what I’m looking for!! Thank you for helping me out.

Cheers :slight_smile:

Vincent just helped me out! Thank you for the help!

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.