Archived topic

Menu background color ?

6 replies · Started by David on July 12, 2020

Viewing posts 1–7 of 7

July 12, 2020 at 4:18 pm #1361327

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

July 12, 2020 at 4:22 pm #1361329

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

July 12, 2020 at 6:07 pm #1361374

Glad you've figured out :)

July 12, 2020 at 6:14 pm #1361378

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

July 13, 2020 at 1:44 am #1361606

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)

July 13, 2020 at 1:46 am #1361608

Thanks David, appreciate the feedback...
Dave

July 13, 2020 at 3:13 am #1361681

You're welcome

This archived topic is closed to new replies.

Start building better websites today.