Docs

[Nuera]

Perhaps you can help me? I’ve read through every post about accordion tab colors, and so far not a single CSS mod has even affected my accordions’ appearance.

Basically, I would like my inactive tabs to be #00338e with white text, and the hover color to be #dc291e with white text. The active tab can remain unaffected.

I’ll post my login creds below, just in case.

Thanks!

[Nuera]

This reply has been marked as private.

[Joao]

Hi There,

Can you let us know where on your website the accordions are placed.

Thanks

Joao

[Nuera]

Sure, they’re at https://flgajax.com/faq/

Thanks!

[Jade]

Hi there,

Please add this code in the customizer:

.x-accordion-heading .x-accordion-toggle.collapsed {
    background-color: #00338e;
    color: #fff;
}

.x-accordion-heading .x-accordion-toggle:hover {
    background-color: #dc291e;
}

[Nuera]

Unfortunately that code isn’t taking either. It’s almost as if something is blocking the styling from appearing on the page…

If you have another suggestion, I’m happy to try it; but it does feel like something else is at play here.

Thanks for your help Jade!

[Friech]

Hi There,

That code works, you just miss the closing bracket for the @media (max-width: 480px) query. I did go ahead and address it.

Cheers!

[Nuera]

Oh my… thank you so much!

[Nuera]

One last element I didn’t anticipate.

Would it be possible to just keep the active tab color #dc291e with white text? I was trying to go for a ‘red, white & blue’ thing with the tabs, but I think just keep them red and blue actually looks better.

Many thanks!

[Rupok]

Hi there,

Thanks for writing back. Let’s use this :

.x-accordion-heading .x-accordion-toggle {
  background-color: #dc291e;
  color: #fff;
}

Cheers!

[Nuera]

Perfect! Thank you again 🙂

[Friech]

You’re more than welcome, glad we could help.

Cheers!

[Author]

Posts