NO BUG: Accordion (nestable) does not save settings in CSS and padding from content is not applied

Browser: Firefox 131.0 (64-Bit)
OS: Linux
URL: Link to a page that illustrates this issue

Because of the reusability of the style settings, I wanted to save them in a CSS class and unfortunately discovered that they are obviously not saved in the CSS class.

As can be seen in this screenshot, this CSS class has some settings that are also implemented in the backend.

Unfortunately, these settings do not apply in the frontend or on other pages (where the class is used).

The Class Manager has no settings for this class on either the page where I made these settings or on my test page. (The page linked above can only be accessed with access data, please write to me via PM.)

Also, the padding settings for the content are not even applied in the backend.

greeting Matze

Hi Matze,
The link doesn’t work, but looking at the accordion on your homepage, it works perfectly fine below 991px, since you added the styles to the tablet portrait breakpoint and not to the desktop breakpoint.

The class manager can’t show anything, as there are basically no styles on the class itself. Since there are multiple settings for e.g. padding, the class needs to be chained with other classes (e.g. the accordion-title-wrapper or accordion-content-wrapper).

Best,
timmse

Hi @timmse ,

Ahhh thx, that’s right, sorry, I made a mistake again, but I can learn from it now, because I assumed that these classes were independent, but with the chaining in the nestable element it should have been logical to me.

But unfortunately I still don’t know why the padding of the content works for you and not for me. In both the builder and the frontend, the content hangs on the edge and doesn’t have the set spacing. (Even when I have the developer console open with the cache deactivated.)

Addendum: If I deactivate the 2 paddings in the developer console, it looks as it should.

greeting Matze

You’re overriding your class styles on the ID level, which always has a higher specificity:

Reset the ID styles on every breakpoint.

Well, the rabbit is well hidden in the padding pepper.

The settings were not mine, which is why I didn’t have them on my radar, but are part of your template, as I just noticed.

But that’s how you learn more and more, from the finest components, because up until now I assumed that your templates came largely without style settings, which is why I had overlooked this.