Change color-overlay on background-image by CSS

Beaver Builder
1

Hi,
I would like to know how to change the color of a color overlay on a background image in a row by CSS.

The row where the background-image is has the custom class “document-topimage”

I have tried this, but it does not work:

.document-topimage fl-row fl-row-full-width fl-row-bg-photo fl-row-bg-overlay {
background:rgba(0, 0, 0, 0.4) !important;
}

Please advise :slight_smile:
ATB
Morten

2

Hey Morten,

You should be able to change the overlay via the Row Settings. Is this not the case for you? If so, do you mind sharing temp admin access so we can check?

Ben

3

Hi Ben,
I’m able to change it through the admin but I would Like to change by CSS so it’s not inline style - can you help?

4

Hi Morten,

If you want to add an overlay via CSS, you will want to look at this topic here.

It should assist you getting an overlay via CSS.

Thanks,
Danny

5

Hi Danny and Ben,

Thank you - it worked like a charm :slight_smile:

ATB
Morten

6

No problem, Morten. Happy to help!

Thanks,
Danny

7