Sass

@pikamart Thank you for your observation. You have drawn my attention of selecting multiple accordion per time. It is actually messing up the layout. I will look into it.

Concerning the container that is resizing, please do you know how I can quickly fix it.

@vickymarz Oh yes, I could definitle help with that. A bit of a hack, well, what you should do

1. Add a max-height on your faq__section selection, to know what is the max-height that you are needing, try to look at the height or the container itself, looking it at developer tools will give you a good idea. But I already did it using a max-height: 479px for desktop.

2. Add an overflow-y: scroll in the faq__section selector. Remember that max-height? It caps the element right, and any element that goes that will be scrollable. Adding this overflow: scroll will make your whole container be have its fixed size and will not be resized even if a user clicks multiple accordion

3. Already done. But keep in mind, if you do this, there will be a scrollbar appearing right. To remove this, simple add this line, change only the first selector

.example::-webkit-scrollbar {
  display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
.example {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}

just change the selector and apply that. That is from w3schools. Applying that will remove the scrollbar but still having its functionality

A bit of a hack right haha if you need more help just drop it here^

@pikamart thank you very much . It worked!

@vickymarz Your welcome and glad that it worked^^