Avada Forums Community Forum Content Boxes: how to disable Hover effect Reply To: Content Boxes: how to disable Hover effect

katieincognito
Participant
Post count: 1

Just faced this issue myself and found a solution that worked for my application.

I wanted to display three content boxes in a row. I wanted each box to have a unique background color, white icon/title/text, and no hover accent color on the icon or title text. Here’s what I did:

– Created three separate columns within my container (you could also do nested columns).
– Added the Content Box element to each container, containing only 1 box per element.
– For each content box, I set the Hover Accent Color to the same color as my content box background.
– I added a line of custom CSS to my theme to remove the hover accent color effect from the titles:

.fusion-content-boxes .fusion-content-box-hover .link-area-link-icon-hover .heading .content-box-heading {
color: #ffffff !important;
}

Credit to LBrand309 for the initial code – I simply modified his recommendation because it only removed the hover accent color from first content box for me. The code above will remove accent hover color effect from the title of ALL content boxes. But keep in mind it will also apply the chosen color to ALL content box titles too.

Cheers!