Can not change the background color for a hover or selected point in the menu - Forum | JoomShaper
Solved Templates

Can not change the background color for a hover or selected point in the menu

Asked by Holger Busch 10 months ago Last activity 9 months ago

Hello, I adopted a site where I can not change the background color for the hover or a selected menu point.
Maybe you can help me with that?
I am using helix ultimate.

Accepted answer

Marked as the solution
Paul Frankowski Senior Staff
10 months ago

yes, you have green background becuase in custom.css in line 39 you used that

.sp-megamenu-parent > li:hover > a {
  background-color: #499c2d;
}

just change color code!

8 more replies

Oldest first Newest first Most helpful
Mehtaz Afsana Borsha Staff
10 months ago

Hi

Thnaks for contacting us. You can use this CSS in your custom.css file. You can change the color code that you want to set.

.sp-megamenu-parent>li.active>a, .sp-megamenu-parent>li.active:hover>a {
    background-color: #5fa497 !important;
}

-Regards.

Holger Busch Asked this
10 months ago

Thanks, I also would like to change the colors for the hover effect, when I am over the menu point with my mouse and the underlining at the start page for Informations, Search and Links. Is it possible to get these informations as well?

Mehtaz Afsana Borsha Staff
10 months ago

Could you please give me a screenshot of that portion?

Paul Frankowski Senior Staff
10 months ago · edited

Add/Use that instead of above, is more universal:

.sp-megamenu-parent > li.sp-menu-item:hover {background:#17567A;}

and for submenu items / und auch für Untermenüpunkte:

.sp-megamenu-parent .sp-dropdown li.sp-menu-item:hover {background:#17567A;}

Holger Busch Asked this
10 months ago

Thanks Paul for you solution. That works fine.
Do you have an idea why just at the menu item "2. Pistole" it's still the green background.

Holger Busch Asked this
10 months ago

... and do you know how I can change the color of the lon underline from "Informationen", "Suche" or "Links"?

Paul Frankowski Senior Staff
10 months ago

Directly from head - no, but easy to check using browser tool - Code Inspector.

The green line is also from your custom.css file (line 22)

.sppb-addon-title {
  border-bottom: 4px solid #499c2d;
  width: 100%;
}

just change color code.

Mehtaz Afsana Borsha Staff
9 months ago

Hi

Is this solved now? If yes, you can then close this post by accepting the answer. And thanks Paul for helping him.

Log in to reply.