Adding accordions to a table

You seem to have taken the page down so I can’t view it.

You need to set the ID on the accoridon-item like this:

[accordion-item id="item-1" title="Title of accordion item"]Drop-down content goes here.[/accordion-item]

Then target it in CSS like this:

#item-1 {
    height: ***px;
}

Again, replacing the *** with the height for that specific item. Note that the names of ID on the accordion-item and in the CSS match.

Hi. Sorry for the confusion. I changed the URL to this – https://upsidefoundation.ca/why-donate/

I am pretty sure I have followed your instructions precisely but perhaps I have overlooked something.

We are starting to get into theming and HTML and CSS which goes far beyond support for this simple plugin. However, a few points:

For starters, classes and ids in CSS should not start with numbers. I would rename to height60.

You should also note that you cannot use the same id twice on a page so each accordion item will need to have it’s own unique id.

Finally, it looks like your CSS is correct, except that your id names start with numbers. You’ll have to update those to match the accordion items.

It’s finally working. Thank you so much for the help!