Difficulties with the addition of an accordion

Joined
Feb 6, 2024
Messages
4
Reaction score
1
Here is what I want my accordion to look like on all my pages. Very simple accordion with background table and minimum space between panels as well as a hover effect.

CSS:
.active, .accordion:hover {
  background-color: #000000;
  color: #d2b48c;
}

The problem is that with a page like this my menu becomes a problem with the accordion in two ways. It adds a space in between each panel which makes using a table look bad by adding too much space, and (oddly enough to me since I suck at this) the hover color of the accordion changes the color of a part of the menu.

I'm having to use black as my accordion color instead of the color I want so it doesn't mess up my menu.

To demonstrate I've created duplicates of my CSS and the page here. Compare the "Bible Data" tab in the menus on both pages.

So, for my accordion I want the spacing like the first link I gave above with the hover color of the accordion different than the menu.

I tried to explain the best I could, and I appreciate any help anyone can give me.

Thanks.
 
Last edited:

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,794
Messages
2,569,641
Members
45,355
Latest member
SJLChristi

Latest Threads

Top