[Resolved] Menu background color ?

[David]

Hi everyone,
I’m working on a site, and I have made the background of the header a particular color.
rgba(151,91,229,0.11)

So I need the menu background to be the same.
So I set Background, Background Hover, and Background Current the same color, but the background behind Current is getting a darker color!
Cant understand why ? (looked in custom CSS)
Thoughts ?
TIA, Dave

[David]

Worked it out…
I changed the color to the hex equivalent (#F4EDFC) and that sorted it!
Thanks, Dave

[Leo]

Glad you’ve figured out 🙂

[David]

Thanks Leo – I would be curious to know why the color value with the transparency does not work ?
Cheers, Dave

[David]

Hi there,

RGBA colors can be semi transparent, the transparency is defined by the Alpha value. In your example rgba(151,91,229,0.11) the Alpha is 11%, which will allow a lot of the color behind the element to show through.

Multiple elements with transparent backgrounds stacked on top of each other will effectively ‘multiply’ their alpha values creating darker shades of the color.

If you had to use the RGBA color for the background then you could set the other menu item values ( eg. Hover ) to 100% transparent by setting their alphas to 0 eg.

rgba(151,91,229,0)

[David]

Thanks David, appreciate the feedback…
Dave

[David]

You’re welcome

[Author]

Posts