Customizing rollover states on menu

Hello,

Apologies if this is something basic but I'm looking to have my color rollover state stay. Right now with my current code, it's just changing with the mouse rollover but would love for the color to stay.

Can you help?

This is my current code:

/* Nav item color */
.header-nav-item a {
    color: #ffffff !important;
    transition-duration: 0.4s;
}
/* Nav item hover color */
.header-nav-item a:hover {
    color: green !important;
    transition-duration: 0.4s;
}
/* Nav item active color */
.header-nav-item--active a {
    color: green !important;
}
 

On 9/30/2021 at 12:06 AM, markserfx said:

Hello,

Apologies if this is something basic but I'm looking to have my color rollover state stay. Right now with my current code, it's just changing with the mouse rollover but would love for the color to stay.

Can you help?

This is my current code:

/* Nav item color */
.header-nav-item a {
    color: #ffffff !important;
    transition-duration: 0.4s;
}
/* Nav item hover color */
.header-nav-item a:hover {
    color: green !important;
    transition-duration: 0.4s;
}
/* Nav item active color */
.header-nav-item--active a {
    color: green !important;
}
 

Can you share your site with the Protected Password?

Hi @bangank36 - it is now open. Right now the home page is a preview page and it'll be launching tomorrow.

You can access the page with menus at diwatakomiks.com/home.

@markserfx You mean active item? It looks like you used Link Items to add About, Contact....

You can drag these original pages from Not Linked >> Main Navigation, the above code will work

Thank you so much @tuanphan!